Des marqueurs personnalisés pour les points à partir d'un fichier geoJson avec Google Maps

Je suis en utilisant GeoJSON en tant que source de données pour Google Maps. J'utilise la v3 de l'API pour créer une couche de données comme suit:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script>
var map;
function initialize() {

  //Initialise the map
  var myLatLng = new google.maps.LatLng(53.231472,-0.539783);
  map = new google.maps.Map(document.getElementById('map-canvas'), {
    zoom: 17,
    center: myLatLng,
    scrollwheel: false,
    panControl: false,
    zoomControl: false,
    scaleControl: true,
    disableDefaultUI: true
  });

  //Initialise base folder for icons
  var iconBase = '/static/images/icons/';

  //Load the JSON to show places
  map.data.loadGeoJson('/api/geo');

}

google.maps.event.addDomListener(window, 'load', initialize);
</script>

<div id="map-canvas"></div>

La source de mon GeoJSON données sont comme suit:

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "geometry": {
        "type": "Point",
        "icon": "/static/images/icons/map-marker-do.png",
        "coordinates": [
          -0.53743,
          53.23437
        ]
      },
      "properties": {
        "name": "Cathedral",
        "description": "One of Europeâ€™s finest Gothic buildings, once the tallest building in the world that dominates Lincoln's skyline.",
        "icon": "/static/images/icons/map-marker-do.png"
      }
    }
  ]
}

Ce que je suis en train de faire est de faire de l'icône représentant un marqueur sur la carte proviennent de "l'icône" de la propriété dans le JSON, mais ne peut pas comprendre comment obtenir les données pour modifier le marqueur par défaut. Quelqu'un peut-il offrir des conseils? Merci.

Où voulez-vous ajouter le marqueur? Que faites-vous avec iconBase?
il utilise un les données de la couche, les caractéristiques(par exemple, des marqueurs ou des Points) chargé par loadGeoJson seront ajoutés automatiquement par l'API
Mon mauvais. J'ai vu que iconBase avec une partie de l'URL dans le JSON et ne pense pas plus loin 🙂
double possible de Traçage des “Points” sur Google Maps à l'aide de l'API JavaScript

OriginalL'auteur doubleplusgood | 2014-06-26

27

Utiliser un style de fonction(style-fonctions vous permettent d'appliquer des styles basés sur une caractéristique spécifique)
```
  map.data.setStyle(function(feature) {
    return {icon:feature.getProperty('icon')};
  });
```
Doux. Merci beaucoup. 🙂

OriginalL'auteur Dr.Molle

Vous devez vous connecter pour publier un commentaire.