2013-10-14 129 views

回答

3

它可以使用GeoMap API完成。請檢查以下網址以供參考。

1)https://code.google.com/apis/ajax/playground/?type=visualization#geo_map

2)https://developers.google.com/chart/interactive/docs/gallery/geomap#regionsexample

這裏是加載美國區域地圖的例子。

<html> 
<head> 
    <script type='text/javascript' src='https://www.google.com/jsapi'></script> 
    <script type='text/javascript'> 
     google.load('visualization', '1', { 'packages': ['geomap'] }); 
     google.setOnLoadCallback(drawMap); 

     function drawMap() { 
      var data = google.visualization.arrayToDataTable([ 
      ['City', 'Popularity'], 
      ['New York', 200], 
      ['Boston', 300], 
      ['Miami', 400], 
      ['Chicago', 500], 
      ['Los Angeles', 600], 
      ['Houston', 700] 
      ]); 

      var options = {}; 
      options['region'] = 'US'; 
      options['colors'] = [0xFF8747, 0xFFB581, 0xc06000]; //orange colors 
      options['dataMode'] = 'markers'; 
      options['width'] = '556px'; 

      var container = document.getElementById('map_canvas'); 
      var geomap = new google.visualization.GeoMap(container); 
      geomap.draw(data, options); 
     }; 

    </script> 
</head> 

<body> 
    <div id='map_canvas'></div> 
</body> 

</html>