在flot图中的堆积线图上的工具提示问题

时间:2015-06-25 16:56:12

标签: javascript jquery flot

我正在使用堆叠线图,但我遇到了悬停工具提示的问题。有些值为0.我只想忽略0值点上的工具提示,因为它们会覆盖大于0的值。

我尝试从数据数组中删除0个值,但是这个图表无法正确呈现。

请看一下:

0 value point which has overridden greater than zero value

2 个答案:

答案 0 :(得分:0)

使用flot.tooltip插件时,您可以将content属性设置为一个函数,该函数返回工具提示的字符串,如果您不想显示工具提示,则设置为false (见documentation),如下所示:

tooltipOpts: {
    content: function (label, x, y, datapoint) {
        if (y == 0) {
            return false;
        }
        else {
            // change this to get your desired format
            return (new Date(x)).toString() + label + x;
        }
    },

使用plothover事件手动生成工具提示时,请在显示工具提示之前检查该值,如下所示:

    $("#placeholder").bind("plothover", function (event, pos, item) {
        // check if value is zero
        if (item && item.datapoint[1] != 0) {
            var x = item.datapoint[0].toFixed(2),
                y = item.datapoint[1].toFixed(2);

            // change this to get your desired format
            $("#tooltip").html(x + item.series.label + y)
                .css({top: item.pageY + 5, left: item.pageX + 5}).fadeIn(200);
        } else {
            $("#tooltip").hide();
        }
    });

答案 1 :(得分:0)

I have analyzed the code base and here are the changes which I have purposed. https://github.com/flot/flot/pull/1447/files

@@ -607,7 +607,8 @@ Licensed under the MIT license.
                 clickable: false,
                 hoverable: false,
                 autoHighlight: true, // highlight in case mouse is near
-                    mouseActiveRadius: 10 // how far the mouse can be away to activate an item
+                    mouseActiveRadius: 10, // how far the mouse can be away to activate an item
+                    ignoreZeroValuePoints: false
                 },
                 interaction: {
                     redrawOverlayInterval: 1000/60 // time between updates, -1 means in same flow
 @@ -2873,8 +2874,11 @@ Licensed under the MIT license.
                         // use <= to ensure last point takes precedence
                         // (last generally means on top of)
                         if (dist < smallestDistance) {
-                            smallestDistance = dist;
-                            item = [i, j / ps];
+                            jps = j / ps;
+                            if(!options.grid.ignoreZeroValuePoints || series[i].data[series[i].datapoints.points.slice(jps * series[i].datapoints.pointsize, (jps + 1) * series[i].datapoints.pointsize)[0]][1] != 0){
+                              smallestDistance = dist;
+                              item = [i, jps];
+                            }
                         }
                     }
                 }