Flot Stacked Bar Chart并在鼠标悬停时显示条形图值

Question

我正在尝试了解Flot的工具提示功能,但并没有真正了解它!

我正在尝试实现一个工具提示,显示堆积条形图的每个部分的标签和值

有人能够指出我的一个例子或提供这样做的代码吗？

Answer 1

以下代码适用于我的Flot堆积条形图,基于显示数据点悬停的Flot示例.诀窍是堆积图表中的"项目"值是累积的,因此工具提示中显示的"y"值必须首先减去下面条形图的数据点.

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;            
    }
});

我没有在Flot文档中找到这个,但是item.datapoint数组似乎包含了我在实践中需要的东西.