如何使用HighChart将plotLand和plotBands添加到HighStocks图表中？

我一直在试图将我的plotLines添加到此图中，并且我已经在线查看了语法;但是，plotLine不会出现。如何使用HighChart将plotLand和plotBands添加到HighStocks图表中？

plotBands看起来很好，所以我只是想看看我可能错过了什么让它工作。

下面是我的jsfiddle链接： https://jsfiddle.net/fbmoju7f/75/

$.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) { 
 
    Highcharts.stockChart('container', { 
 
    title: { 
 
     text: 'Morphine' 
 
    }, 
 

 
    xAxis: { 
 
    type: 'datetime', 
 
     floor: Date.UTC(2017, 2, 2), 
 
     ceiling: Date.UTC(2017, 2, 9), 
 
     plotLine: { 
 
     value: Date.UTC(2017, 2, 8), 
 
     color: '#3A1231', //Purple 
 
     width: 2, 
 
     dashStyle: 'solid' 
 
     } 
 
    }, 
 

 
    yAxis: { //Keep yAxis ---------------------------------------- 
 
     floor: 0, 
 
     ceiling: 100, 
 
     plotBands: [{ 
 
     color: '#F9F98E', //Yellow 
 
     from: 0, 
 
     to: 10 
 
     }, { 
 
     color: '#9DF98E', //Green 
 
     from: 10, 
 
     to: 30 
 
     }, { 
 
     color: '#F9958E', //Red 
 
     from: 30, 
 
     to: 100 
 
     }] 
 
    }, 
 

 
    rangeSelector: { 
 
     buttons: [{ 
 
     type: 'day', 
 
     count: 8, 
 
     text: '-7d' 
 
     }, { 
 
     type: 'day', 
 
     count: 4, 
 
     text: '-3d' 
 
     }, { 
 
     type: 'day', 
 
     count: 3, 
 
     text: '-2d' 
 
     }, { 
 
     type: 'day', 
 
     count: 2, 
 
     text: '-1d' 
 
     }], 
 
     selected: 2 //Initial view upon opening application 
 
    }, 
 

 
    series: [{ 
 
     type: 'spline', 
 
     color: '#4C91FA', 
 
     data: [ //Test data set 
 
     [Date.UTC(2017, 2, 1), 5.7], 
 
     [Date.UTC(2017, 2, 2), 7.3], 
 
     [Date.UTC(2017, 2, 3), 10.3], 
 
     [Date.UTC(2017, 2, 3), 15.6], 
 
     [Date.UTC(2017, 2, 4), 12.7], 
 
     [Date.UTC(2017, 2, 4), 14.0], 
 
     [Date.UTC(2017, 2, 4), 17.8], 
 
     [Date.UTC(2017, 2, 5), 19.1], 
 
     [Date.UTC(2017, 2, 5), 18.4], 
 
     [Date.UTC(2017, 2, 6), 19.5], 
 
     [Date.UTC(2017, 2, 6), 22.7], 
 
     [Date.UTC(2017, 2, 6), 25.1], 
 
     [Date.UTC(2017, 2, 7), 28.2], 
 
     [Date.UTC(2017, 2, 7), 30.4], 
 
     [Date.UTC(2017, 2, 8), 29.6], 
 
     [Date.UTC(2017, 2, 9), 29.0], 
 
     [Date.UTC(2017, 2, 10), 27.8] 
 
     ] 
 
    }] 
 
    }); 
 
});

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
 
<script src="https://code.highcharts.com/stock/highstock.js"></script> 
 
<script src="https://code.highcharts.com/modules/stock/exporting.js"></script> 
 

 
<div id="container" style="height: 400px; min-width: 310px"></div>

来源

2017-04-06 MrEnumerable

你打错属性名，你是不是封闭在括号中的plotLines。它应该是这样的：

xAxis: { 
    type: 'datetime', 
    floor: Date.UTC(2017, 2, 2), 
    ceiling: Date.UTC(2017, 2, 9), 
    plotLines: [{ 
    value: Date.UTC(2017, 2, 8), 
    color: '#3A1231', //Purple 
    width: 2, 
    dashStyle: 'solid' 
    }] 
},

来源

2017-04-07 00:07:48 wergeld

谢谢！它正在工作！ – MrEnumerable

如何使用HighChart将plotLand和plotBands添加到HighStocks图表中？

回答

相关问题