Highcharts Demo

author(s): Torstein Hønsi

by Black Label

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>

<div id="container" style="min-width: 310px; max-width: 600px; height: 400px; margin: 0 auto;"></div>

JavaScript

Highcharts.chart('container', {

  chart: {
    type: 'bubble',
    inverted: true
  },

  xAxis: {
    categories: ["Category 1", "Category 2", "Category 3", "Category 4", "Category 5", "Category 6", "Category 7", "Category 8", "Category 9"],

  },

  yAxis: {
    _maxPadding: 0,
    type: 'datetime',
    dateTimeLabelFormats: {
      day: '%e-%b-%Y'
    },
    labels: {
      rotation: 90,
      style: {
        'fontSize': '12px',
        'fontFamily': 'Arial'
      }
    },
    format: '{value:%e-%b-%Y}',
    tickInterval: 24 * 3600 * 1000,
    startOnTick: false,
    _endOnTick: false
  },

  series: [{
    "name": "admin admin",
    "data": [{
      "x": 0,
      "y": 1516752000000,
      "z": 10
    }, {
      "x": 8,
      "y": 1517097600000,
      "z": 10
    }]
  }],



});