2017-04-06 69 views
0

我一直在試圖將我的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>

回答

0

你打錯屬性名,你是不是封閉在括號中的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' 
    }] 
}, 
+0

謝謝!它正在工作! – MrEnumerable

相關問題