Question

想要输出下面2个输入框中标记点的纬度和经度，然后保存它们，但这可能会在以后发生。当用户拖动标记时，纬度和经度应该不断更新。这是我已经拥有的代码：

请帮忙，我已经尝试通过添加console.log进行调试，但它并没有输出任何可能表明问题所在的地方。至少我在Chrome开发工具中看不到任何内容。当我尝试使用Visual Studio断点进行调试时，它们都没有加载，所以我无法这样做。我也尝试过其他一些东西。

这是javascript：

var map;
var marker = false;

function initMap() {

var centerOfMap = new google.maps.LatLng(51.487987, -0.237269); // St Paul's School

var options = {
    center: centerOfMap,
    zoom: 10
};

// extantiate a map object
map = new google.maps.Map(document.getElementById('map'), options);

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

google.maps.event.addListener(marker, 'dragend', function (event) {
    markerLocation();
});

markerLocation();}



function markerLocation() {
        // give the information back to the HTML
        var currentLocation = marker.getPosition();
        console.log(currentLocation.lat());
        document.getElementById("lat").value = String.valueOf( currentLocation.lat());
        document.getElementById("lng").value = String.valueOf( currentLocation.lng());

}

google.maps.event.addDomListener(window, 'load', initMap);

这是HTML：

<div class="insert-location">
    <p>Select a location where the task will be carried out. Click on a location to select it. Drag the marker to change it.</p>
    <div id="map"></div>
    <input type="text" id="lat" readonly="readonly"><br>
    <input type="text" id="lng" readonly="readonly">
</div>

Answer 1

好的，这是我如何解决它的一个工作示例（添加api密钥）：

http://jsbin.com/rinayek/1/edit?html,css,js,output

第一个替换它：

document.getElementById("lat").value = String.valueOf( currentLocation.lat());
document.getElementById("lng").value = String.valueOf( currentLocation.lng());

为此：

document.getElementById("lat").value = currentLocation.lat();
document.getElementById("lng").value = currentLocation.lng();

第二名让你的<div id="map">不是<div class="insert-location">

的孩子

对于其余的你没问题，请查看示例以获得更清晰

尝试从JS API中的Google API显示纬度和经度

1 个答案: