Как инициировать события на полигонах карты Leaflet?
Я пытаюсь выяснить, как вручную запускать события для полигонов Leaflet (, загружаемых через GeoJSON ).
Короче говоря, у меня есть карта Leaflet с множеством полигонов. У меня также есть обычная гиперссылка за пределами карты, которая при нажатии должна вызывать событие наведения курсора мыши (или любое событие )на конкретном полигоне.
Как назначить идентификаторы всем моим полигонам, чтобы я мог привязать гиперссылки (s )к конкретному событию полигона? Или это даже самый логичный способ сделать это?
В конечном счете, я пытаюсь создать карту с многочисленными полигонами вместе с HTML-таблицей текстовых меток, связанных с каждым полигоном. При нажатии на текст таблицы HTML я хотел бы инициировать события на полигонах карты (и наоборот ). Я просто не знаю, как ссылаться на каждый полигон.
Вот мой очень упрощенный HTML:
<body>
<div id="map" style="height: 550px; width:940px"></div>
<a href="#" id="testlink">Click to trigger a specific polygon mouseover event</a>
</body>
Вот мой очень упрощенный JS:
$(document).ready(function () {
// build the map and polygon layer
function buildMap(data) {
var map = new L.Map('map');
var cloudmadeUrl = 'http://{s}.tile.cloudmade.com/***yourkeyhere***/66267/256/{z}/{x}/{y}.png',
cloudmadeAttribution = '',
cloudmade = new L.TileLayer(cloudmadeUrl, {maxZoom: 18, attribution: cloudmadeAttribution});
var mapLoc = new L.LatLng(43.675198,-79.383287);
map.setView(mapLoc, 12).addLayer(cloudmade);
var geojsonLayer = new L.GeoJSON(null, {});
geojsonLayer.on("featureparse", function (e){
// apply the polygon style
e.layer.setStyle(polyStyle);
(function(layer, properties) {
layer.on("mouseover", function (e) {
// change the style to the hover version
layer.setStyle(polyHover);
});
});
layer.on("mouseout", function (e) {
// reverting the style back
layer.setStyle(polyStyle);
});
layer.on("click", function (e) {
// do something here like display a popup
console.log(e);
});
})(e.layer, e.properties);
});
map.addLayer(geojsonLayer);
geojsonLayer.addGeoJSON(myPolygons);
}
// bind the hyperlink to trigger event on specific polygon (by polygon ID?)
$('#testlink').click(function(){
// trigger a specific polygon mouseover event here
});
});