Highcharts折线图与多色区域

Question

我正在尝试在具有多色区域的高图中创建折线图。我有一些我试图渲染的定时数据，每个结果都有一个状态。当状态是某种颜色时，我想改变折线图下方区域的颜色。

像这样：

以下是我的部分数据示例：

{"GmtDateTime": "2013-07-31 12:20:15", "Speed": 40.068, "StatusCode": "1"}, 
{"GmtDateTime": "2013-07-31 12:30:11", "Speed": 41.823, "StatusCode": "2"}, 
{"GmtDateTime": "2013-07-31 12:40:15", "Speed": 41.987, "StatusCode": "1"}, 
{"GmtDateTime": "2013-07-31 12:50:11", "Speed": 40.192, "StatusCode": "3"}, 
{"GmtDateTime": "2013-07-31 13:00:12", "Speed": 40.877, "StatusCode": "3"}, 
{"GmtDateTime": "2013-07-31 13:10:12", "Speed": 40.364, "StatusCode": "2"}, 
{"GmtDateTime": "2013-07-31 13:20:15", "Speed": 44.331, "StatusCode": "1"}, 
{"GmtDateTime": "2013-07-31 13:30:14", "Speed": 42.89, "StatusCode": "1"},

x轴为“GMTDatetime”，y轴为“Speed”，范围颜色为“StatusCode”。

提前致谢！

Answer 1

Highcharts使用时间戳（以毫秒为单位的时间）而不是日期。在系列/数据对象中应该有x / y参数，而不是“速度”。结果你的json看起来像：

{y: Date.UTC(2012,12,2), y: 42.89, "StatusCode": "1"}

Date.UTC允许以毫秒为单位的返回时间。

如果您需要使用不同颜色的零件图表，则需要使用其他系列。

编辑：

实施例： http://jsfiddle.net/D4sbc/