GoogleChartで世界地図を色分け表示してみた

<div id="visualization" style="width:1000px; height:700px"></div>

<script type="text/javascript" src="http://www.google.com/jsapi"></script>

google.load('visualization', '1', {packages: ['geochart']});
google.setOnLoadCallback(draw);

var records = [
    {name: 'JP', score: 100},
    ...
];

function draw() {
    // テーブルの定義
    var dataTable = new google.visualization.DataTable();
    dataTable.addColumn('string', '国');
    dataTable.addColumn('number', 'なにかの値');
    // データをテーブルに追加
    for (var i = 0; i < records.length; i++) {
        var rec = records[i];
        dataTable.addRow([rec.name, rec.score]);
    }
    // チャートの定義
    var map = new google.visualization.GeoChart(document.getElementById('visualization'));
    // チャートにテーブルのデータを描画！
    map.draw(dataTable, {
      width: 1200,
      height: 700,
      colorAxis: {colors: ['white', 'blue']}
    });
}