堆叠条形图's悬停不起作用

Stacked Bar Chart's Hover not Working

本文关键字：悬停 不起作用 条形图      更新时间：2023-09-26

我正在查看Flot中的堆叠图，我发现条形图中有一些奇怪的东西。

我试着用这个:http://jsfiddle.net/zNXBd/41/

在这个示例代码中，尝试将鼠标悬停在堆叠的行上。悬停有效。现在，这一次，请尝试将"lines"改为"bars"，然后再运行一次。

ds.push({
    data:completes,
    label: "Complete",
    yaxis: 2,
    stack:true,
    bars: {
        show: true, 
        fill: true, 
        order: 2,
    }
});
ds.push({
    data:screeners,
    label: "Pre-Screened",
    yaxis: 1,
    bars: {
        show: true, 
        fill: true, 
        order: 1,
    }
});
ds.push({
    data:holds,
    label: "Holds",
    yaxis: 2,
    stack:true,
    bars: {
        show: true, 
        fill: true, 
        order: 3,
    }
});

注意条形不再是可悬浮的。这部分好像有问题。

你能帮我解决这个问题吗?

看起来你的栏太细了，无法触发悬停。你可能需要在你的bars选项中添加一个barWidth。默认情况下，条宽为1，以x轴为单位。在时间轴上，1 = 1ms，而在你的刻度上，一个1ms宽的条没有被表示(我们只看到笔画，而不是条本身)

From the doc:

"barWidth"是以x轴为单位的条的宽度(如果"horizontal"为true则为y轴)，与以像素为单位的大多数其他度量相反。例如，对于时间序列，单位是毫秒，所以24 * 60 * 60 * 1000产生一天宽度的条形图。

的例子:

bars: {
    show: true, 
    fill: true, 
    order: 2,
    barWidth: 1*3600*1000
}

这是你的小提琴，barwidth设置为1小时:

http://jsfiddle.net/zNXBd/42/

相关文章：