Google地图单击“事件”以移动标记

时间:2015-03-18 10:10:19

标签: javascript google-maps google-maps-api-3

我正在使用谷歌地图来获取用户的坐标,它正在拖动标记工作正常,但我需要通过点击事件更改它。

我试过“点击”而不是“dragend”
google.maps.event.addListener(marker, 'dragend', function(a) 

哪个没用?

我的代码是

    var latlng = new google.maps.LatLng(<?php echo $villa['loc']; ?>);
    var map = new google.maps.Map(document.getElementById('map'), {
    center: latlng,
    zoom: 5,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title: 'move and pin exact point of your property',
    draggable: true
    });

    google.maps.event.addListener(marker, 'dragend', function(a) {
    var result = a.latLng.lat().toFixed(4) + ', ' + a.latLng.lng().toFixed(4);
    $('#loc').val(result);
    });

我从DB收到第一个标记位置。用户可以通过移动标记来改变位置,并获得更新的结果以写入DB。拖动工作正常,但“点击”不是。任何帮助表示赞赏。

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

1 个答案:

答案 0 :(得分:0)

找到解决方案

        <script>
    $(document).ready(function() {

    var latlng = new google.maps.LatLng(<?php echo $villa['loc']; ?>);
    var map = new google.maps.Map(document.getElementById('map'), {
    center: latlng,
    zoom: 12,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title: 'move and pin exact point of your property',
    draggable: true
    });

    google.maps.event.addListener(marker, 'dragend', function(a) {
    var sonuc1 = a.latLng.lat().toFixed(4) + ', ' + a.latLng.lng().toFixed(4);
    $('#loc').val(sonuc1);
    });

                function placeMarker(location) {
                if ( marker ) {
                marker.setPosition(location);
                } else {
                marker = new google.maps.Marker({
                position: location,
                map: map,
                title: 'move and pin exact point of your property'
                });
                }
                }

                google.maps.event.addListener(map, 'click', function(event) {
                placeMarker(event.latLng);
                var sonuc2 = event.latLng.lat().toFixed(4) + ', ' + event.latLng.lng().toFixed(4);
                $('#loc').val(sonuc2);
                });

    });


    $("#il").change(function() {
    var val = $('#il option:selected').val();
    var sonuc3 = (val);
    $('#sonucx').html(sonuc3);
    var mappos = document.getElementById("il").options[document.getElementById("il").selectedIndex].getAttribute('latLng');
    var latlngStr = mappos.split(',', 2);
    var lat = parseFloat(latlngStr[0]);
    var lng = parseFloat(latlngStr[1]);

    var latlng = new google.maps.LatLng(lat, lng);
    var map = new google.maps.Map(document.getElementById('map'), {
    center: latlng,
    zoom: 12,
    mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title: 'pin exact point of your property',
    draggable: true
    });

    var sonuc4 = lat + "," + lng;
    $('#loc').val(sonuc4);

    google.maps.event.addListener(marker, 'dragend', function(a) {
    var sonuc6 = a.latLng.lat().toFixed(4) + ', ' + a.latLng.lng().toFixed(4);
    $('#loc').val(sonuc6);
    });

                function placeMarker(location) {
                if ( marker ) {
                marker.setPosition(location);
                } else {
                marker = new google.maps.Marker({
                position: location,
                map: map,
                title: 'move and pin exact point of your property'
                });
                }
                }

                google.maps.event.addListener(map, 'click', function(event) {
                placeMarker(event.latLng);
                var sonuc5 = event.latLng.lat().toFixed(4) + ', ' + event.latLng.lng().toFixed(4);
                $('#loc').val(sonuc5);
                });



    });
    </script>