zoukankan      html  css  js  c++  java
  • 使用Javascript从Google Places搜索api获取纬度和经度

    如何使用谷歌地图搜索框api从搜索到的位置获取经度和纬度.

     我使用与谷歌演示相同的代码 – https://developers.google.com/maps/documentation/javascript/examples/places-searchbox

    搜索代码:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    <script type="text/javascript">
        //自动搜索
        function initMap() {
            var input = document.getElementById('address_search');
            var places = new google.maps.places.Autocomplete(input);
            google.maps.event.addListener(places, 'place_changed'function () {
                    var place = places.getPlace();
                    var address = place.formatted_address;
                    var latitude = place.geometry.location.A;
                    var longitude = place.geometry.location.F;
                    var mesg = "Address: " + address;
                    mesg += "nLatitude: " + latitude;
                    mesg += "nLongitude: " + longitude;
                    console.log(place);
                    GetLatlong();
            });
        }
        //根据google places搜索api获取经纬度
        function GetLatlong()
        {
            var geocoder = new google.maps.Geocoder();
            var address = document.getElementById('address_search').value;
     
            geocoder.geocode({ 'address': address }, function (results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    var latitude = results[0].geometry.location.lat();
                    var longitude = results[0].geometry.location.lng();
                    alert(latitude+","+longitude);
                }
            })
        }
    </script>
    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=xxxxx&libraries=places&callback=initMap">
    </script>

      

  • 相关阅读:
    二、Elasticsearch核心配置文件详解
    javax.mail.AuthenticationFailedException: 535 authentication failed
    Java compiler level does not match the version of the installed java project facet
    一、设置cookie报非法参数异常
    slf4j的使用规范
    基于token的身份验证JWT
    单点登录
    spring的bean不能注入原因分析
    规避空指针异常规范
    Git远程操作详解
  • 原文地址:https://www.cnblogs.com/ww25/p/11133679.html
Copyright © 2011-2022 走看看