javascript - jQuery Flot 图表中的自定义可移动水平线

Question

我用 Flot 创建了折线图。例如，Y 刻度范围为 0 - 100。现在我有一个输入字段，用户可以在其中输入 0-100 之间的数字。

如果他选择，比如说 80，我想在图表上 Y=80 处创建一条水平线，指示所选值。这条线应该可以随时调整。

到目前为止我还没有找到任何东西，但我希望有人能帮助我。

Answer 1

使用markings选项从输入读取值并在输入值更改时重新绘制图表，如下所示:

var yvalue = parseInt( $('#yvalue').val());
plot.getOptions().grid.markings = [ { yaxis: { from: yvalue, to: yvalue}, color: "#0000bb" } ];
plot.setupGrid();
plot.draw();

这是一个fiddle有一个类似的例子。