javascript - 如何使用高图表添加特定于列的情节线？

Question

我正在尝试使用 js HighCharts 制作柱形图，该图表的每一列都有 2 条唯一的绘图线，而不是跨越整个图表宽度的单个绘图线。

这样我就可以显示每个列的最大值和最小值。

Answer 1

您无法制作以这种方式工作的实际情节线。

您可以使用分散系列，并定义自定义线标记类型，如下所示：

http://jsfiddle.net/highcharts/e96yX/

水平线和垂直线的示例代码：

Highcharts.Renderer.prototype.symbols.vline = function(x, y, width, height) {
    return ['M',x ,y + width / 2,'L',x+height,y + width / 2];
};
Highcharts.Renderer.prototype.symbols.hline = function(x, y, width, height) {
    return ['M',x ,y + height / 2,'L',x+width,y + width / 2];
};

或者，根据您的问题，列范围图也可能会有所帮助：

http://highcharts.com/demo/columnrange