Estoy tratando de comprender la descripción de la funcionalidad de Flot, pero no realmente conseguir mi cabeza alrededor de ella!
Estoy tratando de lograr una información sobre herramientas que muestra la etiqueta y el valor de cada sección de un gráfico de barras apiladas
Podría alguien ser capaz de apuntar hacia mi un ejemplo de esto o de proporcionar el código para hacerlo?
Respuestas
¿Demasiados anuncios?El siguiente código funciona para mi Flot gráfico de barras apiladas, basado en la Flot ejemplo que muestra los datos del punto de asomar. El truco es que el 'elemento' valores en el gráfico apilado son acumulativos, por lo que la 'y' valor mostrado en la punta de la herramienta primero tiene que restar el punto de datos para las barras debajo.
var previousPoint = null;
$("#chart").bind("plothover", function (event, pos, item) {
if (item) {
if (previousPoint != item.datapoint) {
previousPoint = item.datapoint;
$("#tooltip").remove();
var x = item.datapoint[0],
y = item.datapoint[1] - item.datapoint[2];
showTooltip(item.pageX, item.pageY, y + " " + item.series.label);
}
}
else {
$("#tooltip").remove();
previousPoint = null;
}
});
No he podido encontrar esto en la Flot documentación, pero el item.datapoint
matriz parecía contener todo lo necesario en la práctica.
El código de arriba causado redibujar-problemas para mí. Aquí es una mejora en el código:
var previousPoint = [0,0,0];
$("#regionsChart").bind("plothover", function (event, pos, item) {
if (item) {
if (previousPoint[0] != item.datapoint[0]
|| previousPoint[1] != item.datapoint[1]
|| previousPoint[2] != item.datapoint[2]
) {
previousPoint = item.datapoint;
$("#tooltip").remove();
var x = item.datapoint[0],
y = item.datapoint[1] - item.datapoint[2];
showTooltip(item.pageX, item.pageY, item.series.label + " " + y.toFixed(0) );
}
}
else {
$("#tooltip").remove();
previousPoint = [0,0,0];
}
});