Question

我尝试使用geochart api。这个API是最新的，很少有信息。

<!DOCTYPE html>
<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {
        'packages': ['geochart'],
        'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
      });
      google.charts.setOnLoadCallback(drawRegionsMap);

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

        var options = {
          backgroundColor: '#81d4fa',
          showZoomOut: true,
        };
        console.log("showZoomOut=" + options.showZoomOut);
        var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
        google.visualization.events.addListener(chart, "zoomOut", function(){
          options.region = "world";
          console.log(options.region);
          chart.draw(data, options);        
        });

        google.visualization.events.addListener(chart, 'regionClick', function(r) {
          console.log(r);
          options.region = r.region;
          chart.draw(data, options);
        });
        chart.draw(data, options);
      }
    </script>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <title></title>
  </head>
  <body>
    <div id="regions_div" style="width; 900px; height: 500px;"></div>
  </body>
</html>

showZoomOut选项已经成立。但是不显示zoomButton。文件在这里 enter link description here

enter image description here 我希望显示像这样的zoomButton。

Answer 1

这个问题由我自己解决。

zoomButton仅支持geomap。 GeoChart无法应用它。

无法显示GeoChart zoomOut按钮

1 个答案: