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：阈值无法在垂直条形图上显示

1 个答案: