Question

我想将多个GeoJSON文件加载到Google地图并为每个文件独立设置样式。我发现了以下问题，但未能使解决方案起作用。 interact with geojson layers independently in google maps api v3

  function initMap() {

    //Initialize 2 varibles that will take GeoJson files and Load the GeoJson files for each layer
    var alt1row = new google.maps.Data();
    alt1row.loadGeoJson('https://45d0ae3907069179bbd918ae873676bebbe0427a.googledrive.com/host/0B8EzS0XcloQzRFdPeWFIUGVLZlk/ALT_1_ROW.geojson')

    var alt2row = new google.maps.Data();
    alt2row.loadGeoJson('https://45d0ae3907069179bbd918ae873676bebbe0427a.googledrive.com/host/0B8EzS0XcloQzRFdPeWFIUGVLZlk/ALT_2_ROW.geojson');


    //Set the style for each layer
    alt1row.setStyle({
        strokeColor: 'red',
        strokeWeight: .5
    });

    alt2row.setStyle({
        strokeColor: 'blue',
        strokeWeight: .5
    });

    //Set the layers to the map
    alt1row.setMap(map);
    alt2row.setMap(map);

    var map = new google.maps.Map(document.getElementById('map'), {
      center: {lat: 35.333851, lng: -77.555105},
      zoom: 10
    });
  }
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR API KEY&libraries=drawing&callback=initMap"
async defer></script>

Answer 1

我已经解决了同样的问题（我不得不为不同颜色的多边形着色）。我解决了这个问题，通过更新我的geojson文件，将color属性添加到我的文件中。我认为代码会更清晰：

GeoJSon文件：

     {"type":"Feature","properties":{
     "color":"red"},"geometry":{"type": "MultiPolygon","coordinates":[[[[....]]]]
     {"type":"Feature","properties":{"color":"red"},"geometry"
     :{"type": "MultiPolygon","coordinates":[[[[ ....

我的网页html：

     var countries = ['germany','moldova','italy','spain','france'];


    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 5,
      mapTypeId: google.maps.MapTypeId.TERRAIN ,
      styles: styles
    });  

    for (var country in countries){
        map.data.loadGeoJson('http://grp-map.equant.com/GoogleMaps/'+countries[country]+'.geojson');
    }
    map.data.setStyle(function(feature) {

        var k = feature.getProperty('color');
        return {
            fillColor:k,
            strokeWeight:1,
            clickable: false
        }
    });

我希望这会对你有所帮助。

独立地与Google Maps API v3中的多个GeoJson文件进行交互

1 个答案: