JSFiddle - React, Tailwind, and code Playground
HTML
<button id="getJSON">Get JSON</button><br/>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="timeline" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
JavaScript
$(function(){
$("#getJSON").click(function(){
var options = {
chart: {
renderTo: 'timeline',
zoomType: 'x',
type: 'line'
},
title: {
text: 'Releases'
},
yAxis: {
title: {
text: 'Count'
}
},
xAxis: {
type: 'datetime'
},
legend: {
enabled: true
},
series: []
};
var data = {
rows: {
dynamicCategory1: {
0: {
count: 2,
unix_date: 1344225600
},
2: {
count: 2,
unix_date: 1344125600
},
4: {
count: 2,
unix_date: 1334125600
},
3: {
count: 16,
unix_date: 1343312000
},
5: {
count: 16,
unix_date: 1323312000
}
},
}
};
$.ajax({
url:"/echo/json/",
data:data,
type:"POST",
success:function(response)
{
console.log(response);
}
});
$.each(data.rows, function(key, val) {
var series = { data: [] };
series.name = key;
...