JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
<div id="container" style="height: 500px; min-width: 500px"></div>
JavaScript
$(function() {
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-ohlc.json&callback=?', function(data) {
// create the chart
chart = new Highcharts.StockChart({
chart : {
renderTo : 'container'
},
rangeSelector : {
selected : 1
},
tooltip: {
crosshairs: false
},
title : {
text : 'AAPL Stock Price'
},
series : [{
type : 'line',
name : 'AAPL Stock Price',
data : data,
color: 'blue',
dataGrouping : {
enabled: true,
approximation: 'sum',
units : [
['week', // unit name
[1, 4] // allowed multiples
], [
'month',
[6, 12]]
]
}
}]
});
});
});