javascript - How to set Google Map's feature ID from geojson? - Stack Overflow

admin管理员组

文章数量:1305712

How to set Google Map's feature's id from geojson?

id is what returned by getId() function.

The following code does not work (prints undefined) although id property exists in properties:

var uluru = {lat: -25.363, lng: 131.044};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: uluru
  });
  var data = {
    "type": "Feature",
    "geometry": {
      "type": "Point",
      "coordinates": [131.044, -25.363]
    },
    "properties": {
      "Id": 12
    }
  };
  map.data.addGeoJson(data);
  map.data.forEach(function(feature){
    console.log("Id from Google's feature: " + feature.getId());
  });

Fiddle: /

UDPATE

I can write

var data = {
    "type": "Feature",
    "id": 13,
    "geometry": {
      "type": "Point",
      "coordinates": [131.044, -25.363]
    },

but won't this be incorrect Geojson?

How to set Google Map's feature's id from geojson?

id is what returned by getId() function.

The following code does not work (prints undefined) although id property exists in properties:

var uluru = {lat: -25.363, lng: 131.044};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: uluru
  });
  var data = {
    "type": "Feature",
    "geometry": {
      "type": "Point",
      "coordinates": [131.044, -25.363]
    },
    "properties": {
      "Id": 12
    }
  };
  map.data.addGeoJson(data);
  map.data.forEach(function(feature){
    console.log("Id from Google's feature: " + feature.getId());
  });

Fiddle: https://jsfiddle/dimskraft/hj2t5je3/5/

UDPATE

I can write

var data = {
    "type": "Feature",
    "id": 13,
    "geometry": {
      "type": "Point",
      "coordinates": [131.044, -25.363]
    },

but won't this be incorrect Geojson?

• javascript
• google-maps
• google-maps-api-3
• geojson

Share Improve this question Follow edited Jun 30, 2018 at 20:20 xomena 32.2k66 gold badges9696 silver badges125125 bronze badges asked Apr 8, 2017 at 17:43 DimsDims 51.2k130130 gold badges358358 silver badges652652 bronze badges 1

• indeed it would be incorrect, it should be in the properties object – Kat Lim Ruiz Commented Feb 4, 2021 at 19:49

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 11

You should pass a second parameter to addGeoJson() method that defines what propery in your GeoJSON will be used as id.

The second parameter is Data.GeoJsonOptions object

https://developers.google./maps/documentation/javascript/reference#Data.GeoJsonOptions

So the change will be:

map.data.addGeoJson(data, {
    idPropertyName: "Id"
});

Code snippet

function initMap() {
  var uluru = {lat: -25.363, lng: 131.044};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: uluru
  });
  var data = {
    "type": "Feature",
    "geometry": {
      "type": "Point",
      "coordinates": [131.044, -25.363]
    },
    "properties": {
      "Id": 12
    }
  };
  map.data.addGeoJson(data, {
    idPropertyName: "Id"
  });
  
  map.data.forEach(function(feature){
  	console.log("Id from Google's feature: " + feature.getId());
  });
}

#map {
  height: 400px;
  width: 100%;
 }

<h3>My Google Maps Demo</h3>
<div id="map"></div>
 <!-- Replace the value of the key parameter with your own API key. -->
<script async defer
src="https://maps.googleapis./maps/api/js?key=AIzaSyDztlrk_3CnzGHo7CFvLFqE_2bUKEq1JEU&callback=initMap">
</script>

本文标签： javascriptHow to set Google Map39s feature ID from geojsonStack Overflow