Highcharts Boost module Issue
by Dongor7
HTML
<script src="https://code.highcharts.com/6.0.7/highcharts.js"></script>
<script src="https://code.highcharts.com/6.0.4/modules/boost.js"></script>
<script src="https://code.highcharts.com/6.0.7/modules/stock.js"></script>
<link href="https://code.highcharts.com/6.0.7/css/highcharts.css" rel="stylesheet" />
<div id="container" style="height: 550px; width: 500px; margin: 0 auto"></div>
JavaScript
console.time('line');
function getData(n) {
var arr = [],
i,
a,
b,
c,
spike;
for (i = 0; i < n; i = i + 1) {
if (i % 100 === 0) {
a = 2 * 0.3;
}
if (i % 1000 === 0) {
b = 2 * 0.6;
}
if (i % 10000 === 0) {
c = 2 * 0.9;
}
if (i % 50000 === 0) {
spike = 0;
} else {
spike = 1;
}
arr.push([
i,
2 * Math.sin(i / 100) + a + b + c + spike + Math.random()
]);
}
return arr;
}
function getSeries(n, s) {
var i = 0,
r = [];
for (; i < s; i++) {
r.push({
data: getData(n),
lineWidth: 1,
});
}
return r;
}
var n = 50000,
s = 1,
series = getSeries(n, s);
var xInterval = n/20;
Highcharts.chart('container', {
chart: {
zoomType: 'xy'
},
title: {
text: 'Highcharts drawing ' + (n * s) + ' points across ' + s + ' series'
},
legend: {
enabled: true
},
tooltip: {
enabled: false,
},
xAxis: {
tickInterval: xInterval,
min:0,
max:n,
},
yAxis: {
tickInterval: 0.5,
min: 0,
max: 10,
},
subtitle: {
text: 'Using the Boost module'
},
series: series
});
console.timeEnd('line');