Question

我想知道是否有人可以帮助我。

我使用下面的代码来反转地理编码地址详细信息，在这种情况下从OS Grid Ref开始。

有人可能会告诉我，我将如何包含代码，在拖动标记时，会在表单上显示一个名为“regenerateosgridref”的按钮。

(function reversegeocodeosgridref() {

    var map, geocoder, latlng, marker;

    window.onload = function() {

        var myOptions = {
            zoom: 6,
            center: new google.maps.LatLng(54.312195845815246, -4.45948481875007),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            mapTypeControl: true,
            mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
                position: google.maps.ControlPosition.TOP_RIGHT
            },
            navigationControl: true,
            navigationControlOptions: {
                style: google.maps.NavigationControlStyle.ZOOM_PAN,
                position: google.maps.ControlPosition.TOP_LEFT
            },
            scaleControl: true,
            scaleControlOptions: {
                position: google.maps.ControlPosition.BOTTOM_LEFT
            }
        };

        map = new google.maps.Map(document.getElementById('map'), myOptions);

        var form = document.getElementById('searchforlocationosgridref');

        form.onsubmit = function() {

            var lat = document.getElementById('osgb36lat').value;
            var lng = document.getElementById('osgb36lon').value;

            var latlng = new google.maps.LatLng(lat, lng);

            getAddress(latlng);

            return false;
        }

    }

    function geocodePosition(pos) {
        geocoder.geocode({
            latLng: pos
        },

        function(responses) {
            if (responses && responses.length > 0) {
                updateMarkerAddress(responses[0].formatted_address);
            } else {
                updateMarkerAddress('Cannot determine address at this location.');
            }
        });
    }

    function updateMarkerAddress(str) {
        document.getElementById('returnedaddress').value = str;
    }

    function getAddress(latlng) {

        if (!geocoder) {
            geocoder = new google.maps.Geocoder();
        }

        geocoder.geocode({
            'latLng': latlng
        }, function(results, status) {

            if (status == google.maps.GeocoderStatus.OK) {

                if (results[0]) {

                    map.setCenter(results[0].geometry.location);
                    if (!marker) {
                        map.setZoom(16);
                        marker = new google.maps.Marker({
                            map: map,
                            draggable: true
                        });
                    }
                }

                marker.setPosition(results[0].geometry.location);

                google.maps.event.addListener(marker, function() {
                    updateMarkerAddress;
                });

                google.maps.event.addListener(marker, 'dragend', function() {
                    geocodePosition(marker.getPosition());
                    document.getElementById('osgb36lat').value = marker.position.lat();
                    document.getElementById('osgb36lon').value = marker.position.lng();

                    var point = marker.getPosition();
                    map.panTo(point);
                });

                latLng = [marker.position.lat(), marker.position.lng()].join(', ');
                geocodePosition(marker.getPosition());

                document.getElementById('returnedaddress').value = results[0].formatted_address;
            }
        })
    }
})();

非常感谢和亲切的问候

克里斯

Answer 1

在标记dragend事件中添加一行，以显示按钮。

在你的dragend活动中：

document.getElementById('regenerateosgridref').style.display = 'block';

Answer 2

而不是在表单中添加另一个按钮。我添加了一些Javascript代码，它将在拖动标记时更新OS Grid Reference。

在Google Marker Drag上显示按钮

2 个答案: