var seriesOptions = [],
seriesCounter = 0,
names = ['MSFT', 'AAPL', 'GOOG'];
function createChart() {
Highcharts.stockChart('container', {
rangeSelector: {
selected: 4
},
yAxis: {
labels: {
formatter: function () {
return (this.value > 0 ? ' + ' : '') + this.value + '%';
}
},
plotLines: [{
value: 0,
width: 2,
color: 'silver'
}]
},
plotOptions: {
series: {
compare: 'percent',
showInNavigator: true
}
},
tooltip: {
pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>',
valueDecimals: 2,
split: true
},
series: seriesOptions
});
}
function success(data) {
var name = this.url.match(/(msft|aapl|goog)/)[0].toUpperCase();
var i = names.indexOf(name);
seriesOptions[i] = {
name: name,
data: data
};
seriesCounter += 1;
if (seriesCounter === names.length) {
createChart();
}
}
Highcharts.getJSON(
'https://cdn.jsdelivr.net/gh/highcharts/[email protected]/samples/data/msft-c.json',
success
);
Highcharts.getJSON(
'https://cdn.jsdelivr.net/gh/highcharts/[email protected]/samples/data/aapl-c.json',
success
);
Highcharts.getJSON(
'https://cdn.jsdelivr.net/gh/highcharts/[email protected]/samples/data/goog-c.json',
success
);