Google Maps JavaScript API V3 根据地址加载地图

最新推荐文章于 2020-07-08 06:45:17 发布

ouailuo143

最新推荐文章于 2020-07-08 06:45:17 发布

阅读量588

点赞数

分类专栏： JS 文章标签： javascript google api function xhtml query

本文链接：https://blog.csdn.net/ouailuo143/article/details/6747839

版权

JS 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>
      无标题文档
  </title>
  <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
          
  </script>
  <script type="text/javascript">
          var geocoder;
  var map;
  var query = "香港 湾仔 维多利亚公园";
  var display = "<b>单位：</b> 维多利亚公园";

  function initialize() {
      geocoder = new google.maps.Geocoder();
      var myOptions = {
          zoom: 17,
          mapTypeId: google.maps.MapTypeId.ROADMAP
      }
      map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
      codeAddress();
  }

  function codeAddress() {
      var address = query;
      geocoder.geocode({
          'address': address
      }, function(results, status) {
          if (status == google.maps.GeocoderStatus.OK) {
              map.setCenter(results[0].geometry.location);
              var marker = new google.maps.Marker({
                  map: map,
                  position: results[0].geometry.location
              });
              var infowindow = new google.maps.InfoWindow({
                  content: "<b>地址：</b>" + address + "<br>" + display
              });
              infowindow.open(map, marker);
          } else {
              alert("未能解析该地址的原因: " + status);
          }
      });
  }
  </script>
</head>

<body onload="initialize()">
  <div id="map_canvas" style="width:500px; height:400px">
  </div>
</body>

ouailuo143

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Google Maps JavaScript API V3 根据地址加载地图

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">html xmlns="http://
复制链接

扫一扫