个人中心
gpt4 book ai didi

javascript - 如何通过 Google map 地理编码而不是经度和纬度使用地址

转载 作者：行者123 更新时间：2023-11-29 21:47:57 24 4
gpt4 key购买 nike

目前我正在尝试了解如何使用 Google map 地理编码。我已经有了一个可以存储地址以及经度和纬度的数据库，并且我还可以使用它来输出经度和纬度..但是..我希望它使用地址而不是使用经度和纬度。那么让我在下面解释一下我想要做什么:

关于http://www.bartnooijens.nl/school/webapp-eindopdracht/#acti-toe用户可以添加新条目，也可以添加地址。我希望我的 Google map 能够读取该地址并将其放置在 map 上。现在我已将经度和纬度静态存储到数据库中以获取标记，但这不是我想要的。

MYSQL:

  • 地址(需要用于 Google map )
  • lon(当前用于静态 lon，但不想使用 lon)
  • lat(当前用于静态纬度，但不想使用纬度)

下面是我现在拥有的代码，当我使用经度和纬度时正在工作。

我还尝试读取https://developers.google.com/maps/documentation/geocoding/intro但我的编码经验还不足以让它发挥作用。所以我希望你们能帮我一点忙。提前致谢!

<!DOCTYPE html>
<head>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=AIzaSyAsh1JAlWZL0SBacR3N94aVzrp4PPGQQeg&sensor=false"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script type="text/javascript">

             function initialize(lat,lon,label,tekst) {

              // Instellen coordinaten uit de paramaters van de aanroep
              var myLatlng = new google.maps.LatLng(lat,lon);

              // Opties voor de kaart, de coordinaten worden het middelpunt
               var myOptions = {
                 zoom: 15,
                 center: myLatlng,
                 mapTypeId: google.maps.MapTypeId.ROADMAP
               }

              // Maak een nieuwe kaart aan met de ingestelde opties
               var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

              // Maak een infowindow met de tekst die via de parameter binnen kwam
               var infowindow = new google.maps.InfoWindow({
                   content: tekst
               });

              // Url van het icon dat op de kaart wordt gezet
               var image = 'images/maps-marker.png';

              // Plaats een marker op de opgegeven coordinaten
               var marker = new google.maps.Marker({
                   position: myLatlng,
                   map: map,
                   title: label,
                   icon: image
               });
              // Voeg een eventhandler toe voor het tonen van de info als iemand op de marker klikt
               google.maps.event.addListener(marker, 'click', function() {
                 infowindow.open(map,marker);
               });
             }

              function loadMap() {
              initialize('51.584294','4.795296','','');
              }
        </script>


</head>

<body  onload="loadMap()";>
    <div id="map_canvas"></div>
</body>
</html>

最佳答案

这段代码成功了:

 <div id="map" style="width: 400px; height: 300px;"></div> 

   <script type="text/javascript"> 

   var address = 'London, UK';

   var map = new google.maps.Map(document.getElementById('map'), { 
       mapTypeId: google.maps.MapTypeId.TERRAIN,
       zoom: 6
   });

   var geocoder = new google.maps.Geocoder();

   geocoder.geocode({
      'address': address
   }, 
   function(results, status) {
      if(status == google.maps.GeocoderStatus.OK) {
         new google.maps.Marker({
            position: results[0].geometry.location,
            map: map
         });
         map.setCenter(results[0].geometry.location);
      }
   });

   </script>

关于javascript - 如何通过 Google map 地理编码而不是经度和纬度使用地址，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33943990/

24 4 0
文章推荐： javascript - meteor #each循环准备就绪
文章推荐： android - RelativeLayout 支持多种屏幕尺寸
文章推荐： android - 在其中使用 Listview 时 ViewFlipper 不工作
文章推荐： 将消息传递给 API 时的 Javascript 对象编码/解码
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com