Question

我制作了一个风格的谷歌地图，我想使用一些可视化Geocharts。我能同时使用吗？

  html, body, #map-canvas {
    margin: 0;
    padding: 0;
    height: 100%;
  }
  </style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
var map;
var mateo = new google.maps.LatLng(37.53, -122.343);

var MY_MAPTYPE_ID = 'custom_style';

function initialize() {

var featureOpts = [...MY STYLE...];

var mapOptions = {
    zoom: 10,
    center: mateo,
    mapTypeControlOptions: {
      mapTypeIds: [google.maps.MapTypeId.ROADMAP, MY_MAPTYPE_ID]
    },
    mapTypeId: MY_MAPTYPE_ID
  };

  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);

  var styledMapOptions = {
    name: 'Custom Style'
  };

  var customMapType = new google.maps.StyledMapType(featureOpts, styledMapOptions);

  map.mapTypes.set(MY_MAPTYPE_ID, customMapType);
}

google.maps.event.addDomListener(window, 'load', initialize);

现在，我还想使用Visualization，GeoCharts

<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 = {};

        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>

谢谢，

理想情况下，我希望为所有选定国家/地区设置地图样式和其他样式设置。感谢

Answer 1

是的，您可以同时使用地图和GeoCharts - 只需包含两者的javascript和HTML。 Map和GeoChart样式和代码不会相互干扰（除非你想要两者之间的某些交互，在这种情况下有办法将它们连接在一起）。

编辑以回应评论：

GeoCharts和地图不能合并为一张地图;但Maps API确实支持自定义图层，您可以使用这些图层使用彩色矢量多边形来构建等值区域图，这样可以为您提供所需的结果。

谷歌地图风格＆amp;可视化GeoCharts

1 个答案: