Javascript 使用标记从谷歌地图获取纬度/经度坐标
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9000813/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Get latitude/longitude coordinates from a Google map using a marker
提问by Zabs
I just wondered if anyone knew of a simple script available that will do the following:
我只是想知道是否有人知道一个简单的脚本可以执行以下操作：
Load a google map in view, when clicked it displays a marker that will save the lat and long values to a variable?
在视图中加载谷歌地图，单击时会显示一个标记，将纬度和经度值保存到变量中？
Does anyone know if something like this already exists in PHP?
有谁知道PHP中是否已经存在这样的东西？
Thanks in advance
提前致谢
回答by Salman A
Perhaps you are looking for something similar to this Latitude-Longitude Finder Tool. The example code iswas API v2. Below is trimmed down version of the code using Google Maps API v3:
也许您正在寻找类似于此Latitude-Longitude Finder Tool 的东西。示例代码是是 API v2。以下是使用 Google Maps API v3 的精简版代码：
var latlng = new google.maps.LatLng(51.4975941, -0.0803232);
var map = new google.maps.Map(document.getElementById('map'), {
center: latlng,
zoom: 11,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
position: latlng,
map: map,
title: 'Set lat/lon values for this property',
draggable: true
});
google.maps.event.addListener(marker, 'dragend', function(a) {
console.log(a);
// bingo!
// a.latLng contains the co-ordinates where the marker was dropped
});
Demo
演示
Explanation: you must set the draggableproperty of the marker to true. You can then hook a callback function to that marker's dragendevent; the new co-ordinates are passed to the function and you can assign them to a JavaScript variable or form field.
说明：您必须将draggable标记的属性设置为 true。然后，您可以将回调函数挂接到该标记的dragend事件；新坐标传递给函数，您可以将它们分配给 JavaScript 变量或表单字段。
回答by Code L?ver
// add a click event handler to the map object
GEvent.addListener(map, "click", function(overlay, latLng)
{
// display the lat/lng in your form's lat/lng fields
document.getElementById("latFld").value = latLng.lat();
document.getElementById("lngFld").value = latLng.lng();
});
I thinks when you will get the lat-lng then you can place marker.
我认为当您获得 lat-lng 时，您可以放置标记。
回答by ori
Check out Google maps API v.3. From the events page:
查看谷歌地图 API v.3。从活动页面：
google.maps.event.addListener(map, 'click', function(event) {
// use event.latLng to place a google.maps.Marker
});
回答by Zabs
I have managed the following so far - how could I amend this to move the marker position when I click anywhere on the map
到目前为止，我已经管理了以下内容 - 当我点击地图上的任何地方时，我如何修改它以移动标记位置
I've added the following but it doesnt seem to do anything
我添加了以下内容但它似乎没有做任何事情
google.maps.event.addListener(map, 'click', function(event) {
addMarker(event.latLng);
});
回答by Rolwin Crasta
the below code works well
下面的代码运行良好
var latlng = new google.maps.LatLng(51.4975941, -0.0803232);
var map = new google.maps.Map(document.getElementById('map'), {
center: latlng,
zoom: 11,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
position: latlng,
map: map,
title: 'Set lat/lon values for this property',
draggable: true
});
google.maps.event.addListener(marker, 'dragend', function (event) {
document.getElementById("latbox").value = this.getPosition().lat();
document.getElementById("lngbox").value = this.getPosition().lng();
});
