JSFiddle - React, Tailwind, and code Playground
by Umair Rafiq
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 400px"></div>
JavaScript
$(document).ready(function () {
var value = $.getJSON('https://api-fillings.socialmarketanalytics.com/comparener?f1=4460725&f2=6588021&output=json')
var JSON = [{
"ReadData": "99",
"Time": "07\/09\/2015 00:00:07"
}, {
"ReadData": "101",
"Time": "07\/09\/2015 00:01:07"
}, {
"ReadData": "113",
"Time": "07\/09\/2015 00:02:07"
}, {
"ReadData": "115",
"Time": "07\/09\/2015 00:03:07"
}, {
"ReadData": "96",
"Time": "07\/09\/2015 00:04:07"
}, {
"ReadData": "103",
"Time": "07\/09\/2015 00:05:07"
}];
var options = {
chart: {
renderTo: 'container',
type: 'spline'
},
xAxis: {},
series: [{}]
};
//$.getJSON('data.json', function (data) {
// imitate getJSON:
var categories = [],
points = [];
$.each(JSON, function(i, el) {
categories.push(el.Time);
points.push(parseFloat(el.ReadData));
});
options.xAxis.categories = categories;
options.series[0].data = points;
var chart = new Highcharts.Chart(options);
//});
});