Suite

Leaflet Marker-Cluster JSONP GeoServer


J'espère que je peux obtenir la même aide d'ici. J'ai commencé à créer une carte de dépliant, veuillez voir ici: http://gis.xyz/leaflet2.html Je souhaite montrer mes caractéristiques de point postgis (basé sur le Royaume-Uni) sur cette carte avec la méthode de cluster. Les points sont déjà sur la carte (j'ai utilisé geoserver-jsonp), mais je n'arrive pas à comprendre comment puis-je ajouter de la couche à la couche de cluster. J'ai également ajouté un exemple de markercluster au script, c'est ainsi que j'aimerais voir mon calque. Ce serait super si quelqu'un pouvait m'aider à répondre à cette question.

var owsrootUrl = 'http://217.8.255.188:8080/geoserver/opengeo/ows'; var defaultParameters = { service : 'WFS', version : '2.0', request : 'GetFeature', typeName : 'opengeo:evernote_geom', outputFormat : 'text/javascript', format_options : 'callback:getJson', SrsName : 'EPSG :4326' }; var parameters = L.Util.extend(defaultParameters); var URL = owsrootUrl + L.Util.getParamString(paramètres); var WFSLayer = null; var ajax = $.ajax({ url : URL, dataType : 'jsonp', jsonpCallback : 'getJson', success : function (response) { WFSLayer = L.geoJson(response, { style : function (feature) { return { stroke : false, fillColor: 'FFFFFF', fillOpacity: 0 }; }, onEachFeature: function (feature, layer) { popupOptions = {maxWidth: 600}; layer.bindPopup('

'+feature.properties.url+'


'+feature.properties.title ,popupOptions); } }).addTo(map); } });

Pour ce faire, vous pouvez utiliser leLeaflet.markerclusterplug-in ici https://github.com/Leaflet/Leaflet.markercluster. Après l'avoir ajouté à votre projet, vous devez définir un groupe de clusters de marqueurs :

marqueurs var = L.markerClusterGroup();

Ensuite, vous devez d'abord ajouter les marqueurs à ce groupe de clusters, puis ajouter le groupe à la carte :

markers.addLayer(a_group_of_markers); map.addLayer(marqueurs);

Dans votre code, vous chargez les marqueurs avec Ajax puis vous les ajoutez à la carte, donc le chemin le plus direct sera le suivant :

marqueurs var = L.markerClusterGroup(); var ajax = $.ajax({ url : URL, dataType : 'jsonp', jsonpCallback : 'getJson', success : function (response) { WFSLayer = L.geoJson(response, { style : function (feature) { return { stroke : false, fillColor: 'FFFFFF', fillOpacity: 0 }; }, onEachFeature: function (feature, layer) { popupOptions = {maxWidth: 600}; layer.bindPopup('

'+feature.properties.url+'


'+feature.properties.title ,popupOptions); } }).addTo(markers.addTo(map)); } });