Question

我设法用leaflet.js创建地图＆amp; jQuery移动。现在我需要摆脱jQuery mobile而只是使用jQuery。

一切正常，但我无法点击我在地图上绘制的多边形。它之前使用过jQuery mobile。

任何提示？

这是我的简化代码：

var map = L.map('map', {
        zoomControl: false
    });
    L.tileLayer('http://{s}.tile.cloudmade.com/**apikey***/997/256/{z}/{x}/{y}.png', {
        attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery &copy; <a href="http://cloudmade.com">CloudMade</a>',
        maxZoom: 18
    }).addTo(map);

对于多边形：

var geojsonFeature = { "type": "Polygon","coordinates": value.polygon};                             
var polycolor = getGebColor(value.geb_nr);                          
var geojsonStyle = {"color": polycolor};                            
polygons[i] = L.geoJson(geojsonFeature, {style: geojsonStyle}).addTo(map);

// make clickable
polygons[i].on('click', function(e) {
      if (lastMarker) {
         map.removeLayer(lastMarker);
  }
  var url = "http://*****/tugetherMap.php?callback=&id="+value.id+"&type=B";
  markers[i] = L.marker([value.point[1], value.point[0]]).addTo(map);
  gebName = value.nameLang;                                     

  markers[i].bindPopup("<a class='gebOnMap' href='gebaeude.html' >"+gebName+"</a>").openPopup();
  lastMarker = markers[i];                              
  });

多边形[i] .on（'click'，...）是不再有效的部分。它适用于 map.on（'click'，...）

Answer 1

有这个问题并通过以下

解决了

function onEachFeature(feature, layer) {
    // Do all your popups and other binding in here
    // does this feature have a property named popupContent?
    if (feature.properties && feature.properties.popupContent) {
        layer.bindPopup(feature.properties.popupContent);
    }
}

var geojsonFeature = {
"type": "Feature",
"properties": {
    "name": "Coors Field",
    "amenity": "Baseball Stadium",
    "popupContent": "This is where the Rockies play!"
},
"geometry": {
    "type": "Point",
    "coordinates": [-104.99404, 39.75621]
}
};

L.geoJson(geojsonFeature, {
   onEachFeature: onEachFeature
}).addTo(map);

在你的代码中我猜它会是

polygons[i] = L.geoJson(geojsonFeature, {onEachFeature: onEachFeature,
                                         style: geojsonStyle}).addTo(map);



function onEachFeature(feature, layer) {
    // Some jazz and magic you need to do with your layer and feature objects
}

Answer 2

您需要将每个多边形绑定到click事件处理程序，如此。

L.geoJson(geojsonFeature, {
    onEachFeature: function(feature, layer) {
        layer.on('click', function(e) {
            // Do whatever you want here, when the polygon is clicked.
        });
    }
}).addTo(map);

Answer 3

我的解决方案是将Leaflet降级到0.7.3或升级到1.0-beta2（撰写本文时的最新版本）。

leaflet map：使多边形可点击

3 个答案: