从谷歌地图获取标记坐标

时间:2014-05-03 18:38:00

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

我将谷歌地图添加到我的网站,现在我要做的是当一个人在地图上标记一个标记时,我需要将标记的坐标设置为2个标签lat和lng 这是我到目前为止所做的事情

<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
    var map;

    function initialize() {
        var haightAshbury = new google.maps.LatLng(33.9000, 35.5333);
        var mapOptions = {
            zoom: 8,
            center: haightAshbury,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
        google.maps.event.addListener(map, 'click', function(event) {
            addMarker(event.latLng);
        });
    }

    // Add a marker to the map and push to the array.
    function addMarker(location) {
        var marker = new google.maps.Marker({
                position: location,
                map: map
        });
        var lat = marker.getPosition().lat();
        var lng = marker.getPosition().lng();
    }

    google.maps.event.addDomListener(window, 'load', initialize);
</script>

和标签:

<div id="panel">
    <label id="lat"><script>document.getElementById("lat").innerHTML=lat;</script></label>
    <label id="lng"><script>document.getElementById("lng").innerHTML=lng;</script></label>
</div>

抱歉,但是初学者....谢谢

2 个答案:

答案 0 :(得分:0)

这看起来像是标签标签之间的脚本标签的漂亮技巧。脚本在页面加载时进行评估,因此脚本在标签内的位置不会像这样神奇地更新标签标签。

相反,尝试在addMarker()中添加该功能,以便它执行名称“添加标记”意图(或者您希望它做什么?)。

function addMarker(location) {
    var marker = new google.maps.Marker({
            position: location,
            map: map
        }),
        lat = document.getElementById('lat'),
        lng = document.getElementById('lng');

    lat.innerHTML = location.lat();
    lng.innerHTML = location.lng();
}

答案 1 :(得分:0)

包含jquery并在.html()

的帮助下将lat lng指定给标签

FIDDLE DEMO