LeafletJS - Olay Yönetimi
Leaflet JavaScript programı, kullanıcı tarafından oluşturulan çeşitli olaylara yanıt verebilir. Bu bölümde, Leaflet ile çalışırken olay işlemenin nasıl gerçekleştirileceğini gösteren birkaç örnek vereceğiz.
Olay işleme
Haritaya olay eklemek için aşağıda verilen adımları izleyin.
Step 1 - Bir Mapbir < div > öğesi (Dize veya nesne) ve harita seçenekleri (isteğe bağlı) ileterek nesne.
Step 2 - Bir Layer istenen döşemenin URL'sini ileterek nesne.
Step 3 - Katman nesnesini haritaya ekleyin. addLayer() yöntemi Map sınıf.
Step 4 - İşleyiciyi aşağıda gösterildiği gibi haritaya ekleyin.
map.on("click", function(e){
new L.Marker([e.latlng.lat, e.latlng.lng]).addTo(map);
})Misal
Aşağıdaki kod, Leaflet kullanarak bile işlemeyi gösterir. Yürütüldüğünde, haritaya tıklarsanız, o belirli konumda bir işaretçi oluşturulacaktır.
<!DOCTYPE html>
<html>
<head>
<title>Leaflet Polygons</title>
<link rel = "stylesheet" href = "http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"/>
<script src = "http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
</head>
<body>
<div id = "map" style = "width: 900px; height: 580px"></div>
<script>
// Creating map options
var mapOptions = {
center: [16.506174, 80.648015],
zoom: 7
}
var map = new L.map('map', mapOptions); // Creating a map object
// Creating a Layer object
var layer = new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
map.addLayer(layer); // Adding layer to the map
map.on("click", function(e){
new L.Marker([e.latlng.lat, e.latlng.lng]).addTo(map);
})
</script>
</body>
</html>Aşağıdaki çıktıyı üretir -
