Leaflet - 可拖动标记和坐标以字段形式显示 [英] Leaflet - draggable marker and coordinates display in a field form

问题描述

我必须做一个可拖动的标记，其坐标应显示在字段中。它将成为PHP中联系表单的一部分。我创建了一个可拖动的标记，帮我现在该做什么。

I have to do a draggable marker and its coordinates should be displayed in fields. It will be a part of a contact form in PHP. I created a draggable marker, help me what to do now.

var marker = L.marker(new L.LatLng(53.471, 18.744), {
draggable: true
}).addTo(map);

http://jsfiddle.net/xTh5U/

以下是Google Maps API中的示例，我需要在Leaflet中使用相同的内容。

Here is example in Google Maps API, I need the same in Leaflet.

推荐答案

您应该使用L.Marker的dragend事件，因此您知道拖动已经结束，然后使用getLatLng方法获取标记的坐标L.Marker。当您获取它们时，您可以将它们分配给文本输入的值。

You should use the dragend event of L.Marker, so you known dragging has ended, then get the coordinates of the marker by using the getLatLng method of L.Marker. When you've fetched those you can assign them to the values of your text inputs.

marker.on('dragend', function (e) {
    document.getElementById('latitude').value = marker.getLatLng().lat;
    document.getElementById('longitude').value = marker.getLatLng().lng;
});

关于Plunker的工作示例： http://plnkr.co/edit/iyMhaoAyllr2uNSOHhS9?p=preview

Working example on Plunker: http://plnkr.co/edit/iyMhaoAyllr2uNSOHhS9?p=preview

这篇关于Leaflet - 可拖动标记和坐标以字段形式显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！