堆积条形图的悬停不起作用 [英] Stacked Bar Chart's Hover not Working

问题描述

我正在检查Flot中的Stacked Charts，我在条形图中发现了一些奇怪的东西。

I am checking Stacked Charts in Flot and I found out something weird in the Bar Chart.

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

在此示例代码中，尝试将鼠标悬停在堆叠线上。哈弗正在工作。
现在，请尝试将行更改为栏并再次运行。

In this sample codes, try to hover your mouse on the stacked lines. Hover is working. Now, this time, please try to change "lines" to "bars" and run again.

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

请注意，酒吧不再是可以收回的。好像这部分存在问题。

Notice that the bars are not anymore hoverable. Seems like there's an issue in this part.

你能帮我解决一下这个问题吗？

Could you please help me how to fix this issue?

推荐答案

看起来你的酒吧太薄了，悬停不会触发。
您可能需要在条形图选项中添加barWidth。
默认情况下，barwidth为1，以x轴为单位。在时间轴上，1 = 1ms，并且在您的比例下，没有表示1 ms宽度条（我们只看到笔划，而不是条形本身）

It seems your bars are too thin for the hover to trigger. You might need to put a barWidth in your bars options. By default, the barwidth is 1, in x-axis unit. In a time axis, 1 = 1ms, and at your scale, a one ms width bar isnt represented (we only see the stroke, not the bar itself)

来自doc：

barWidth是以x轴为单位的条形宽度（如果水平为真，则为y轴的宽度） ），与像素中指定的大多数其他度量相反。例如，对于时间序列，单位是毫秒，因此24 * 60 * 60 * 1000生成宽度为一天的条形。

"barWidth" is the width of the bars in units of the x axis (or the y axis if "horizontal" is true), contrary to most other measures that are specified in pixels. For instance, for time series the unit is milliseconds so 24 * 60 * 60 * 1000 produces bars with the width of a day.

例如：

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

这是您在1小时内设置的宽度的小提琴：

Here is your fiddle with barwidth set at 1 hour:

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

这篇关于堆积条形图的悬停不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！