使用 flot api 实现条形图的阈值

Question

我正在使用 flot 来绘制图表。我想实现该功能，以便能够突出显示图表中 10% 的增长，以不同于我现在使用的颜色显示。 我使用的代码是：

var options_blue = {
    series: {
        color: 'blue',
        threshold: { above: 5, color: 'green' },
        bars: { show: true, barWidth: 20 * 20 }
    },
    xaxis: { show: false, min: 1 },
    yaxis: { show: false, min: 1, max: max_value }
};

var options_red = {
    series: {
        color: '#ff0000',
        threshold: { above: 10, color:'green' },    
        bars: { show: true, barWidth: 20 * 20 }
    },
    threshold: { above: 5, color: "yellow" },
    xaxis: { show: false, min: 1 },
    yaxis: { show: false, min: 5, max: max_value }
};

我正在使用 jquery.flot.threshold.js，但是超过阈值的图表颜色没有变化。

Answer 1

您使用的是“高于”，但阈值插件仅支持“低于”。所以你只需要交换你的系列和阈值颜色，并改用'below'。

另请注意，在您的 options_red 中，您在系列选项之外还有第二个阈值选项。阈值插件仅在系列选项中查找选项，因此第二个将被忽略。