html, body, #container { 

  width: 100%; 

  height: 100%; 

  margin: 0; 

  padding: 0; 

} 

anychart.onDocumentReady(function () {

  // load a json data file

  anychart.data.loadJsonFile('https://gist.githubusercontent.com/awanshrestha/ff3ae5c08238b1f4f950f022aaad2f6f/raw/3766915befaeea7a32f3d41fdc2ece110e7543d7/circle-packing-chart.json',

    function(data) {

​

      // add the data

      var treeData = anychart.data.tree(data, 'as-table');

​

      // create a circle packing chart instance

      var chart = anychart.circlePacking(treeData);

      // customize the tooltip

      chart

        .tooltip()

        .useHtml(true)

        .format(function () {

          var src = this.item.get('industry');

          if (src) {

            return '<div>'

              + '<span>Name: ' + this.name + '</span> <br/>'

              + '<span>Net worth in billions USD: ' + this.value + '</span> <br/>'

              + '<span>Source: ' + this.item.get('source') + '</span>'

              + '</div>' 

          }

          return '<span>' + this.value.toFixed(2) + ' billion USD</span>';

        });

​

      // add a chart title

      chart.title("100 Richest People, According to Forbes");

      // change the appearance

      chart.background('#f6f6f6');

      chart

        .hovered()

        .stroke(function () {

         return {

           thickness: 2,

         };

       });

      chart

        .stroke(function () {

          return {

            thickness: 1,

          };

        });

      // specify the container element id

      chart.container('container');

      // initiate the drawing of the chart

      chart.draw();

    }

  );

});