mapbox geojson属性在悬停时不可用

Question

我正在使用mapbox并将多个geojson层加载到地图上，如下所示：

...

var aLayer = L.mapbox.featureLayer('/a.geojson');
var bLayer = L.mapbox.featureLayer('/b.geojson');
var cLayer = L.mapbox.featureLayer('/c.geojson');

var layers = {
    LayerA: aLayer,
    LayerB: bLayer,
    LayerC: cLayer
}

...

layers.LayerA.addTo(map).on('ready', function(e) {
  map.fitBounds(LayerA.getBounds(), {animate: true});
});

L.control.layers(layers).addTo(map);

每个Geojson特性包含许多属性；例如，标题和描述在工具提示中正确显示。

我遇到的问题是通过其他交互访问这些属性。我正在调整悬停时每个多边形的样式，如下所示：

LayerA.on('mouseover', function(e)
{
    e.layer.setStyle({
        weight: 2,
        fillOpacity: 0.7
    });

    if (!L.Browser.ie && !L.Browser.opera) {
        e.layer.bringToFront();
    }
});

LayerA.on('mouseout', function(e)
{
    e.layer.setStyle({
        weight: 0.5,
        fillOpacity: 0.5
    });
});

通过e.layer或e.target访问交互中属性的任何尝试都将失败。我假设工具提示工作意味着它们可用，但无法计算出我哪里出错了。。。？

Answer 1

您所做的是处理特性层的事件，而不是特性层中包含的单个层的事件。FeatureLayer是一组图层，用于初始化时传递给它的集合中的每个功能的图层。以这个集合为例，在一个特性中呈现三个标记Layer：

var featureCollection = {
    "type": "FeatureCollection",
    "features": [{
        "type": "Feature",
        "properties": {
            "id": 1
        },
        "geometry": {
            "type": "Point",
            "coordinates": [0, 0]
        }
    },{
        "type": "Feature",
        "properties": {
            "id": 2
        },
        "geometry": {
            "type": "Point",
            "coordinates": [30, 30]
        }
      },{
        "type": "Feature",
        "properties": {
            "id": 3
        },
        "geometry": {
            "type": "Point",
            "coordinates": [-30, -30]
        }
    }]
};

var featureLayer = L.mapbox.featureLayer(featureCollection).addTo(map);

现在，如果将处理程序挂接到单击featureLayer事件：

featureLayer.on('click', function (e) {
    console.log('Clicked featureLayer');
});

不管我点击哪个标记，它都会开火。它甚至不知道我点击了哪个标记，在那里e.target将保存特性层的实例，而不是包含在其中的单个层。现在，如果我将clickhandler挂接到特性组中的独立层的单击事件上：

featureLayer.eachLayer(function (layer) {
    layer.on('click', function (e) {
        console.log('Clicked feature ID: ' + e.target.feature.properties.id);
    });
});

现在，在单击处理程序e.target中，保存单击标记的实例，该标记的特性对象可供您使用。

这里有一个关于Plunker的工作示例：http://plnkr.co/edit/qwgDtQMRuR4XTcrnC1vf?p=preview