google map 获取经纬度

最新推荐文章于 2025-06-09 11:57:08 发布

转载最新推荐文章于 2025-06-09 11:57:08 发布 · 1.2k 阅读

.net 同时被 3 个专栏收录

57 篇文章

订阅专栏

silverlight

48 篇文章

订阅专栏

arcgis for silverlight 教程

46 篇文章

订阅专栏

本文介绍了一个使用Google Maps JavaScript API v3进行地理编码的简单示例。通过输入地址并调用地理编码服务，可以将地址转换为经纬度坐标，并在地图上显示出来。同时，该示例还展示了如何创建标记并在信息窗口中显示地址及其对应的经纬度。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: Geocoding Simple</title>
<link href=" http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src=" http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var geocoder;
var map;
function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(31.23, 121.47);
    var myOptions = {
      zoom: 12,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

function codeAddress() {
    var address = document.getElementById("address").value;
    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        this.marker = new google.maps.Marker({
                title:address,
            map: map,
            position: results[0].geometry.location
        });
                var infowindow = new google.maps.InfoWindow({
                    content: '<strong>'+address+'</strong><br/>'+'纬度: '+results[0].geometry.location.lat()+'<br/>经度: '+results[0].geometry.location.lng()
                });
                infowindow.open(map,marker);
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
}
</script>
</head>
<body onload="initialize()">
<div>
    <input id="address" type="textbox" value="上海市">
    <input type="button" value="地址解析" onclick="codeAddress()">
</div>
<div id="map_canvas" style="height:90%;top:30px"></div>
</body>
</html>