Highcharts Demo

author(s): Torstein Hønsi

by Michel Penke

HTML

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


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

JavaScript

Highcharts.chart('container', {

  chart: {
    type: "column",
    marginTop: 50,
    marginRight: 50,
  },
  title: {
    style: {
      'fontSize': '1em'
    },
    useHTML: true,
    x: -27,
    y: 8,

    text: ''
  },
  loading: true,
  exporting: {
    enabled: true
  },
  xAxis: {
  	type: 'category',
    labels: {
      groupedOptions: [{
        style: {
          color: 'red' // set red font for labels in 1st-Level
        }
      }, {
        rotation: -45, // rotate labels for a 2nd-level
        align: 'right'
      }],
      rotation: 0 // 0-level options aren't changed, use them as always
    },


  },

  yAxis: [{ // Primary yAxis
    /*labels: {

        style: {
            color: '#89A54E'
        }
    },*/
    title: {
      //text: 'Issue Count'
      text: "y-name"
    }
  }],

  plotOptions: {
    	column: {
    	pointPlacement: 2,
      grouping: false,
      pointWidth: 12
    },
    series: {
      dataLabels: {
        enabled: true,
        crop: false,
        rotation: -60,
        allowOverlap: true,

        //y: 10,
        "style": {
          //"fontSize": "8px",

          //"fontFamily": "Arial",
          "fontWeight": "normal"
        },
        lang: {
          numericSymbols: [",000", "M", "G", "T", "P", "E"]
        },
        formatter: function() {
          if (this.y !== 0) {

            return Highcharts.numberFormat(this.y, 0, '', ',') + '%';
          }
        }

      },
    },
    shadow: false
  },
  credits: {
    enabled: false
  },
  series:

    [{
        "name": "Breakaway *",
        "data": [
          17310,
          15982
        ]
      },
      {
        "name": "Breakaway Plus *",
        "data": [
          0,
          0,
          11738,
          19181,
          3454
        ]
      },
      {
        "name": "Dawn *",
        "data": [
          0,
          0,
          0,
          0,
          0,
          14586,
          19324,
          8038,
          9442
        ]
      },
     ...