1

经过研究，我发现目前还不可能在 GeoChart 中仅显示特定省份，但我问自己是否可以放大到特定省份？我找不到任何关于它的信息。

这是我能得到的最接近的（显示加拿大和其中的所有省份）：

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

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

        var options = {'region':'CA','resolution':'provinces'};

        var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
        chart.draw(data, options);
    };
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>​

请注意，国家列表不相关，我只是在测试缩放。提前感谢您的帮助。

4

1 回答 1

1

不幸的是，无法使用 API 中的选项来执行此操作。我能做的是用 CSS 做了一些 tweeks，以达到类似的结果。

我在 div 周围创建了另一个 div，它将显示地图，具有特定的大小和隐藏的溢出。然后我以大比例创建了地图，并使用 css 边距值将其放置在父 div 内，仅显示我想要的区域。

例如：

#canvas {
    width:250px;
    height:300px;
    overflow:hidden;
}
#visualization {
    top:-150px;
}

这是一个工作示例：

http://jsfiddle.net/cmoreira/njB6m/

希望能帮助到你！干杯

于 2012-11-11T13:42:59.563 回答