4

我正在创建一个谷歌地理图表，其中包括美国、韩国、台湾、中国和印度的城市。如果我使用regions: 'world'tshe 地图会太大，城市气泡几乎看不到。我正在使用以下选项：

var options = {
  region: 'world',
  displayMode: 'markers',
  resolution: 'provinces'
}

是否可以创建包含两个或多个区域的地图？

例如，美国和亚洲。我正在考虑使用以下内容设置区域：

var options = {
  region: '019','142',
  displayMode: 'markers',
  resolution: 'provinces'
}
4

1 回答 1

2

不，不可能在同一张地图上创建包含两个区域的地图。

原因是 Google 地理图表依赖于它们所显示的任何区域的 SVG 图像，并且 API 中存在数量有限的 SVG 地图（这就是为什么有些国家不使用的原因resolution: 'provinces'）。

但是，可以创建包含两个区域数据的数据表，并使用相同的数据表填充两个单独的地图（每个区域一个）。

例如：

<!--
You are free to copy and use this sample in accordance with the terms of the
Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Google Visualization API Sample</title>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load('visualization', '1', {packages: ['geochart']});

      function drawVisualization() {
        var data = google.visualization.arrayToDataTable([
          ['Country', 'Popularity'],
          ['Germany', 200],
          ['United States', 300],
          ['Brazil', 400],
          ['Canada', 500],
          ['France', 600],
          ['RU', 700]
        ]);

        // Draw First Chart
        var geochart = new google.visualization.GeoChart(
          document.getElementById('visualization'));
        geochart.draw(data, {width: 556, height: 347, region: '019', resolution: 'countries'});

        // Draw Second Chart
        var geochart2 = new google.visualization.GeoChart(
          document.getElementById('visualization2'));
        geochart2.draw(data, {width: 556, height: 347, region: '150', resolution: 'countries'});
      }


      google.setOnLoadCallback(drawVisualization);
    </script>
  </head>
  <body style="font-family: Arial;border: 0 none;">
    <div id="visualization"></div>
    <div id="visualization2"></div>
  </body>
</html>

另请注意，“美洲”区域（019）与世界地图一样高，实际上不会为您节省“世界”上的任何空间。如果加拿大或墨西哥没有任何标记，我建议使用北美或仅使用“美国”。

于 2013-05-15T23:46:27.637 回答