Flot：阈值未能显示在垂直条形图上

Question

我正在尝试向垂直条形图添加阈值，但无论出于何种原因，它们都没有出现。

这是我对图表的设置：

var metOptions = {
    series:{
        bars: {
            show: true,
            align: "center",
            barWidth: 24 * 60 * 60 * 600,
            lineWidth: 1,
            fill: 0.7,
        },
    },
    xaxis: {
        mode: "time",
        axisLabel: "Date",
        axisLabelUseCanvas: true,
        axisLabelFontSizePixels: 12,
        axisLabelFontFamily: 'Verdana, Arial',
        axisLabelPadding: 10,
        color: "black",
    },
    yaxes: [{
        position: "left",
        min: 90,
        max: 100,
        color: "black",
        tickDecimals: 2,
        axisLabelUseCanvas: true,
        axisLabelFontSizePixels: 12,
        axisLabelFontFamily: 'Verdana, Arial',
        axisLabelPadding: 3
    }
    ],
    legend: {
        noColumns: 1,
        labelBoxBorderColor: "#000000",
        position: "ne"
    },
    grid: {
        hoverable: true,
        borderWidth: 2,
        mouseActiveRadius: 50,
        backgroundColor: { colors: ["#ffffff", "#EDF5FF"] },
        axisMargin: 20
    },
    tooltip: true,
    tooltipOpts: {
        content: "%x, %y%"
    }
};

这是我的数据集定义：

var dataset = [
    {
        label: "Metalization",
        data: chartData,
        color: "#F00",
        threshold: [
            {
                below: 95,
                color: "rgb(0, 0, 255)"
            },
            {
                below: 94,
                color: "rgb(0, 255, 0)"
            }
        ],
    }
]

$.plot($("#metal-variance"), dataset, metOptions);

这是我目前正在测试的数据：

[[1445144400000,95.76],[1445230800000,95.83],[1445317200000,93.99],[1445403600000,94.57],[1445490000000,93.37],[1445576400000,88.53]]

X 是时间戳，Y 是值。

下面是生成的图表的屏幕截图： Flot Graph

所以我设置了阈值，如果值低于 94，则条形图应为绿色，但正如您从图像中看到的那样，第三个和第五个条形图低于 94，但它们仍在显示红色。

如能就此问题提供任何帮助，我们将不胜感激。

Answer 1

在此fiddle中工作：

您确定包含了 jquery.flot.threshold.min.js 文件吗？

Flot：阈值未能显示在垂直条形图上

Flot: Threshold Failing to Show on Vertical Bar Graph

javascript

jquery

flot