Random data and boost

by amrutaJgtp

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/boost.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>

<div id="container"></div>

CSS

#container {
  height: 400px;
  min-width: 310px;
  max-width: 800px;
  margin: 0 auto;
}

JavaScript

var inputData = [];
for (var i = 0; i <= 999; i++) {
  inputData.push(Math.round(Math.random() * 10));
}
Highcharts.chart('container', {
  "chart": {
    "zoomType": "xy",
    "alignTicks": true
  },
  "plotOptions": {
    "series": {
      "cursor": "pointer",
      "allowPointSelect": true,
      "showInLegend": true,
      "turboThreshold": 0,
      "pointPadding": 0.1,
      "getExtremesFromAll": true
    }
  },
  "legend": {
    "enabled": true
  },
  "credits": {
    "enabled": false
  },
  "exporting": {
    "enabled": false
  },
  "lang": {
    "noData": ""
  },
  "xAxis": {
    "title": {
      "text": "Categories",
      "align": "middle",
      "margin": 5
    },
    "opposite": false,
    "axisInternalName": "0",
    "id": "xAxis0",
    "tickWidth": 1,
    "tickmarkPlacement": "on",
    "gridLineWidth": 0,
    "max": null
  },
  "yAxis": [{
    "title": {
      "text": "Sales",
      "align": "middle",
      "margin": 5
    },
    "opposite": false,
    "axisInternalName": "0",
    "tickWidth": 0,
    "reversed": false,
    "id": "yAxis0",
    "gridLineWidth": 0
  }],
  "boost": {
    "enabled": true,
    "seriesThreshold": 2
  },
  "series": [{
    "zIndex": 1,
    "type": "column",
    "yAxis": 0,
    "data": inputData,
    "name": "SHIPPING_COST",
    "boostThreshold": 5001
  }]
});