Completed Code for Visualizing the Data with Google Chart Treemap « PD4CS - Python programming, common student misconceptions, student projects

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Treemap</title>
</head>
<body>

  <h2>Treemap of Top 50 Baby Girl Names and Top 50 Baby Boy Names in 2014</h2>
  <div id='map'></div>

</body>
</html>
<script type="text/javascript" src="data2014.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
  google.charts.load('current', {'packages':['treemap']});
  google.charts.setOnLoadCallback(drawChart);

  function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Node ID');
    data.addColumn('string', 'Parent');
    data.addColumn('number', 'Number of Names');

    data.addRows(data_rows);

    var tree = new google.visualization.TreeMap(document.getElementById('map'));

    var options = {
      minColor: '#ffe6e6',
      midColor: '#ff4d4d',
      maxColor: '#b30000',
      showScale: true,
      height: 500,
      highlightOnMouseOver: true,
      fontSize:16
    };

    tree.draw(data, options);
  };

</script>