[英]How to marker search become draggable and give the Longitude & latitude in leaflet
I want my leaflet map able to drag the marker and get the longitude and latitude.我希望我的 leaflet map 能够拖动标记并获取经度和纬度。 The marker show from search result.
搜索结果中的标记显示。 Here my js code but I'm stuck T^T please help me.
这是我的 js 代码,但我卡住了 T^T 请帮帮我。 Thank you
谢谢
and here my HTML for address and Latitude Longitude在这里我的 HTML 用于地址和纬度经度
<form>
<p>
<label for="address">Address</label>
<input id="address">
</p>
<p>
<label for="latitude">Lintang</label>
<input id="latitude" placeholder="-6.922045042885848">
</p>
<p>
<label for="longitude">Bujur</label>
<input id="longitude" placeholder="107.61605564716159">
</p>
</form>
<div class="frame-lokasi">
<div id="map"></div>
</div>
here my js这里是我的 js
var map = L.map('map', {
center: [-6.922045042885848, 107.61605564716159],
zoom: 18
});
L.control.scale().addTo(map);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
var searchControl = new L.esri.Controls.Geosearch().addTo(map);
var results = new L.LayerGroup('resuls', {draggable: true}).addTo(map);
var marker = L.marker([-6.922045042885848, 107.61605564716159], {
draggable: true
}).addTo(map);
marker.on('dragend', function (e) {
document.getElementById('latitude').value = marker.getLatLng().lat;
document.getElementById('longitude').value = marker.getLatLng().lng;
});
searchControl.on('results', function(e){
results.clearLayers();
for (var i = e.results.length - 1; i >= 0; i--) {
results.addLayer(L.marker(e.results[i].latlng));
}
});
setTimeout(function(){$('.pointer').fadeOut('slow');},3400);
Update this line: results.addLayer(L.marker(data.results[i].latlng));
更新这一行:
results.addLayer(L.marker(data.results[i].latlng));
searchControl.on('results', function(e) {
results.clearLayers();
for (var i = e.results.length - 1; i >= 0; i--) {
var searchMarker = L.marker(data.results[i].latlng, {
draggable: true
});
document.getElementById('latitude').value = searchMarker.getLatLng().lat;
document.getElementById('longitude').value = searchMarker.getLatLng().lng;
searchMarker.on('dragend', function(e) {
console.log(e);
var _marker = e.target;
console.log(_marker.getLatLng())
document.getElementById('latitude').value = _marker.getLatLng().lat;
document.getElementById('longitude').value = _marker.getLatLng().lng;
})
results.addLayer(searchMarker);
}
});
And is data.results
a typo? data.results
是错字吗? L.marker(data.results[i].latlng, {
data is nowhere defined maybe e.results
L.marker(data.results[i].latlng, {
data is nowhere defined 也许e.results
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.