Question

我想制作美国可选状态地图similar to what's shown here。除了多个国家，我只想渲染美国各州。

In this jsBin，我希望看到个别状态在突出显示时会突出显示一些弹出文本。但是，我实际上只看到了美国的灰色背景轮廓，没有明显的个别状态。

请提供一个完成任务的工作jsBin。

http://jsbin.com/jodesitoto/edit?html,output

<!DOCTYPE html>
<html>
  <head>
    <!---- >
    https://developers.google.com/chart/interactive/docs/gallery/geochart#full
    <!---->
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['geochart']});
      google.charts.setOnLoadCallback(drawRegionsMap);

      function drawRegionsMap() {

        var data = google.visualization.arrayToDataTable([
          ['State', 'Select'],
          ['US-AL', 0],
          ['US-AK', 0],
          ['US-AR', 0],
          ['US-AK', 0],
          ['US-AZ', 0],
          ['US-Colorado', 0],
          ['US-CO', 0],
          ['US-DE', 0],
          ['US-FL', 0],
          ['US-HI', 0],
          ['US-KS', 0],
          ['US-KY', 0],
          ['US-MI', 0],
          ['US-MO', 0],
          ['US-MS', 0],
          ['US-MT', 0],
          ['US-NE', 0],
          ['US-NJ', 0],
          ['US-NM', 0],
          ['US-NY', 0],
          ['US-OR', 0],
          ['US-PA', 0],
          ['US-TX', 0],
          ['US-UT', 0],
          ['US-VA', 0],
          ['US-WA', 0],
          ['US-WV', 0],
          ['US-WY', 0],
        ]);

        var options = {
          region: 'US',
          displayMode: 'regions',
        };

        var chart = new google.visualization.GeoChart(document.getElementById('geochart'));

        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="geochart" style="width: 900px; height: 500px;"></div>
  </body>
</html>

Answer 1

将resolution: 'provinces',添加到options对象。

    var options = {
      region: 'US',
      displayMode: 'regions',
      resolution: 'provinces',
    };

Geochart美国声明使用Google GeoCharts API

1 个答案: