html,

body,

#container {

  width: 100%;

  height: 100%;

  margin: 0;

  padding: 0;

}

anychart.onDocumentReady(function () {

  var data = {

    header: [

      '#',

      'LENOVO',

      'HP',

      'DELL',

      'APPLE',

      'ACER',

      'ASUS',

      'OTHERS'

    ],

    rows: [

      ['Q1', 12613,11114,10158,3555,2900,2603,8693],

      ['Q2', 16197,16165,10648,4368,4007,3593,9829],

      ['Q3', 18310,15447,10827,5513,5085,4747,11448],

      ['Q4', 21491,15683,13199,6893,4741,4570,12813]

    ]

  };

​

  // create a mosaic chart

  var chart = anychart.mosaic();

  // set points padding

  chart.pointsPadding(3);

  // set chart data

  chart.data(data);

  // set the chart labels settings

  chart.labels()

    .format(function(e){

      var value = ((this.value)/1000).toFixed(2);

      return value + " M";

    });

  // set container id for the chart

  chart.container('container');

  // set the chart title  

  chart.title("Quarterly Brand-wise Personal Computer Shipments in 2020");

  // initiate chart drawing

  chart.draw();

});