【问题标题】:How do you click on a map and have latitude and longitude fields in a form populated?您如何单击地图并在表单中填充纬度和经度字段?
【发布时间】:2009-11-12 23:10:20
【问题描述】:

我有一个表格,用户需要在需要识别位置的地方填写该表格。我在表单上有纬度和经度输入字段。我也在寻找小数点经纬度。我想要的似乎很简单。我只想有一个链接,用户可以点击它会弹出一个地图(谷歌或雅虎),他可以使用地图找到位置并点击它,这将自动填充纬度和的两个输入字段远离地图。有没有人这样做过?

【问题讨论】:

  • 我不太明白这个问题。你能改写一下或澄清一下吗?
  • 我不知道如何更好地解释它。我只希望纬度和经度的每个字段在他们单击地图时填充值。我知道使用 google earth,当您将鼠标指针放在地图上时,在状态栏中您可以看到十进制的 lat 和 long 值。我想要一种方法,只需单击地图上的一个点,就可以将这两个值从地图传输到表单字段中。我真的不知道该怎么解释。

标签: forms google-maps maps latitude-longitude


【解决方案1】:

使用 Google Maps API,您可以非常轻松地做到这一点。只需向您的地图对象添加一个单击事件处理程序,该处理程序会传递用户单击位置的纬度/经度坐标(请参阅click 事件here 的详细信息)。

function initMap()
{
    // do map object creation and initialization here
    // ...

    // 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();
    });
}

【讨论】:

    【解决方案2】:

    该代码适用于 google map api 版本 3。v2 已被贬值,因此最好坚持使用 v3。

    有一个 id 为 mapdiv 的 div 用于加载地图

    使用 id 为 latlng 的输入元素在您单击地图时显示 lat 和 lng。这样人们就可以将该值复制到另一个应用程序中。您可以根据需要修改 opts 变量。

    像在代码中一样为单击事件添加事件处理程序。这样当您单击地图时,输入元素将填充 lat 和 lng 值。

    var map;
    function mapa()
    {
        var opts = {'center': new google.maps.LatLng(26.12295, -80.17122), 'zoom':11, 'mapTypeId': google.maps.MapTypeId.ROADMAP }
        map = new google.maps.Map(document.getElementById('mapdiv'),opts);
    
        google.maps.event.addListener(map,'click',function(event) {
            document.getElementById('latlng').value = event.latLng.lat() + ', ' + event.latLng.lng()
        })      
    }
    

    以上就是你所需要的。


    如果您想在将鼠标移动到地图上时查看 lat 和 lng 的值,请添加鼠标移动事件侦听器,如下面的代码所示。您可以使用跨度甚至输入元素来查看值。我在我的代码中使用了 span。

    google.maps.event.addListener(map,'mousemove',function(event) {
        document.getElementById('latspan').innerHTML = event.latLng.lat()
        document.getElementById('lngspan').innerHTML = event.latLng.lng()
    });
    

    【讨论】:

      【解决方案3】:

      您需要知道地图上至少两个点的纬度/经度,最好不要靠得很近,还需要知道它们相对于一个角的像素坐标(即最好的两个点是对角)。然后通过插值将点击的像素坐标转换为纬度/经度是简单的数学运算。但是,请注意,这仅在地图覆盖的区域相对于地球曲率“平坦”时才有效。如果地图覆盖了很大的区域,比如 6000 英里宽,就会出现明显的失真。如果你需要这个准确,你必须做一些地图投影来计算位置。

      【讨论】:

        【解决方案4】:

        查看 Google Maps API 以及此链接:http://www.gorissen.info/Pierre/maps/googleMapLocation.php

        我认为 Google Maps API 可能可以满足您的需求。

        【讨论】:

        • 谢谢你的链接,我去看看。
        猜你喜欢
        • 2015-11-02
        • 2015-08-19
        • 2016-05-21
        • 1970-01-01
        • 1970-01-01
        • 2021-04-05
        • 1970-01-01
        • 2011-11-05
        • 1970-01-01
        相关资源
        最近更新 更多