Question

我的代码有问题。在使用绘图管理器绘制标记后，我想制作一个可拖动的标记，并且我想要输入字段[lat＆amp;的值。 lon]使用可拖动标记位置值进行更改。这是我的代码：

    function initMap() {
        // set up the map
        mapModal = new google.maps.Map(document.getElementById('mapModal'), {
            center : {lat: lat, lng: lng},
            zoom : 15,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            disableDefaultUI: false,
            zoomControl : true,
        });

        var drawingManager = new google.maps.drawing.DrawingManager({
            drawingMode: google.maps.drawing.OverlayType.MARKER,
            drawingControl: true,
            drawingControlOptions: {
                position: google.maps.ControlPosition.TOP_CENTER,
                drawingModes: ['marker']
            },
            markerOptions: {
                editable: true,
                draggable: true,
            },
        });
        drawingManager.setMap(mapModal);
        google.maps.event.addListener(drawingManager, 'overlaycomplete', function(marker) {
            google.maps.event.addListener(marker, 'position_changed', function () {
                var lat = marker.getPosition().lat();
                var lon = marker.getPosition().lng();

                $('#lat').val(lat);
                $('#lon').val(lon);
            });
        });
    }

我从来没有得到输入字段[lat＆amp;的值。 lon]已发生变化。谁能帮到我解决我的问题？谢谢！

Answer 1

我认为主要问题是marker.getPosition（）。lat（）;在事件处理程序中，您应该使用“this”而不是“marker”。不确定它是否能解决所有问题。

这是一个简单的“拖动标记，在输入元素中写入坐标”

<input id="lat" />
<input id="lng" />
<div id="map"></div>
<style>
    #map {
        height: 400px;
    }
</style>
<script>
    function initMap() {
        var myLatlng = {  // Brussels
            lat: 50.85,
            lng: 4.35
        };

        var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 12,
            center: myLatlng
        });

        var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            draggable: true,
            title: 'Drag me'
        });

        google.maps.event.addListener(marker, 'position_changed', function() {
            // inside an event handler you should use "this".  
            // "this" represents whatever got affected, in this case the marker
            document.getElementById('lat').value = this.getPosition().lat();
            document.getElementById('lng').value = this.getPosition().lng();
        });

    }
</script>
<script src="https://maps.googleapis.com/maps/api/js?callback=initMap"></script>

绘图管理器标记侦听器Position_Changed

1 个答案: