Leaflet Markercluster - 關於懸停問題的工具提示

我是一個JavaScript的新手，試圖在線創建交互式地圖，其中一些事件應該通過點擊標記來觸發，有些事件只需通過懸停它們即可。管理點擊部分工作，但由於Markercluster插件，我不知道在哪裏使用onEachFeature函數的懸停一個標記打開工具提示。任何人都可以告訴我我做錯了什麼？Leaflet Markercluster - 關於懸停問題的工具提示

var geoJsonFeature = { 
    type: 'FeatureCollection', 
    features: 
    [ 
    { 
    type: 'Feature', 
    properties: { 
     title: 'Title', 
     page: 'some.html', 
     'marker-color': '#000000', 
     zoom: 7 
    }, 
    geometry: { 
     type: 'Point', 
     coordinates: [12.583745,55.6750803] 
    } 
}, 
... 
}; 

// access to mapbox api 
L.mapbox.accessToken ='...'; 
var map = L.mapbox.map('map', 'example1234').setView([34, -37], 3); 

function getTitle(marker) { 
    return marker.feature.properties.title; 
}; 

function getPage(marker) { 
    return marker.feature.properties.page; 
}; 

var markerGroup = new L.MarkerClusterGroup({showCoverageOnHover:false}); 

var geoJsonLayer = L.geoJson(geoJsonFeature, { 
    onEachFeature: function (feature, layer) { 
    var popupContent = getTitle(marker); 
    layer.bindPopup(popupContent); 
    } 
}); 

markerGroup.addLayer(geoJsonLayer); 

map.addLayer(markerGroup); 

markerGroup.on('click', function(ev) { 
    var marker = ev.layer; 

    marker.on('click', function(ev) { 
    if(map.getZoom() > marker.feature.properties.zoom) { 
     map.setView(ev.latlng, map.getZoom()); 
    } 
    else { 
     map.setView(ev.latlng, marker.feature.properties.zoom); 
    } 
    }); 
    }); 
}); 

geoJsonLayer.on('mouseover', function(e) { 
    e.layer.openPopup(); 
}); 

geoJsonLayer.on('mouseout', function(e) { 
    e.layer.closePopup(); 
});

來源

2015-01-13 Leo

您需要使用onEachFeature選項獲取個人標記和綁定處理程序的鼠標懸停和鼠標移開事件：

onEachFeature: function (feature, layer) { 
    layer.bindPopup(feature.properties.title); 
    layer.on("mouseover", function() { 
    layer.openPopup(); 
    }); 
    layer.on("mouseout", function() { 
    layer.closePopup(); 
    }); 
}

這裏有Plunker工作示例：http://plnkr.co/edit/hfjOWv3uCBFawDGqR3Ue?p=preview

注意：在這個例子中我沒有使用ClusterMarker，但使用ClusterMarker時它應該工作得很好

來源

2015-01-13 22:47:51 iH8

感謝它的完美運作。爲了將其與Markercluster集成，我將「onEachFeature」添加到其中存儲GeoJson數據的圖層中，以後我將其添加到Markergroup中，然後再添加到地圖中。 VAR geoJsonLayer = L.geoJson（geoJsonFeature，{ onEachFeature：功能（功能，層）{ layer.bindPopup（feature.properties.title）; layer.on（「鼠標懸停」，函數（）{ 層。 openPopup（）; }）; layer.on（「鼠標移出」，函數（）{ layer.closePopup（）; }）;} }）; – Leo

Leaflet Markercluster - 關於懸停問題的工具提示

回答

相關問題