Google 地图 Maps API V2

最新推荐文章于 2025-06-17 18:13:04 发布

iteye_21104

最新推荐文章于 2025-06-17 18:13:04 发布

阅读量142

点赞数

CC 4.0 BY-SA版权

分类专栏：其他文章标签： xhtml javascript python ViewUI

本文链接：https://blog.youkuaiyun.com/iteye_21104/article/details/82365637

其他专栏收录该内容

11 篇文章

订阅专栏

[img]http://dl.iteye.com/upload/picture/pic/115072/f7ae5c92-96e8-3817-8ca6-53466d82f98c.jpg[/img]

获取地点坐标

<!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>Untitled Document</title>
<script
	src="http://ditu.google.cn/maps?file=api&v=2&key=ABQIAAAAe3YR_oZq7RQougOHlEQYxRTrT8HRiYVHGz6s-cexYhuHznMTnBQJ3hrfCSvSmQ_Fqr80B62kDy8djA&sensor=true"
	type="text/javascript"></script>
<script type="text/javascript">
	window.g = {};
	window.$ = function(id) {
		return document.getElementById(id)
	};
	window.onload = function() {
		if (GBrowserIsCompatible()) {
			g.map = new GMap2($("map"));
			g.map.addControl(new GLargeMapControl());
			g.map.addControl(new GMapTypeControl());
			g.map.addControl(new GScaleControl());
			g.geocoder = new GClientGeocoder();
			g.getCoordinates = function(address) {
				g.geocoder.getLatLng(address, function(point) {
					if (point) {
						//alert("x:"+point.lat()+" y:"+point.lng());
						g.map.setCenter(point, 13);
						var marker = new GMarker(point);
						g.map.addOverlay(marker);
						var info = "<strong>" + address + "</strong>: ("
								+ point.lat() + "," + point.lng()+")";
						$("info").innerHTML = info;
						marker.openInfoWindowHtml(info);
						marker.__address_info = info;
						GEvent.addListener(marker, "click", function() {
							g.map.setCenter(this.getLatLng());
							this.openInfoWindowHtml(this.__address_info);
							$("info").innerHTML = info;
						});
					} else {
						//alert("地址: " + address);
					}
				})
			}
			$("btn_go").onclick = function() {
				g.getCoordinates($("address").value);
			}
			$("btn_go").onclick();
		} else {
			alert('浏览器不兼容！');
		}
	}
	window.onunload = function() {
		GUnload();
	}
</script>
<style media="screen">
body {
	margin: 0;
	padding: 0;
	font-size: 9pt;
	line-height: 1.5em;
}

#frame {
	width: 600px;
	margin: 20px auto 10px;
}

#form {
	margin: 0 0 10px;
	text-align: center;
}

#form input {
	border: 1px solid #ccc;
	font-size: 9pt;
	width: 200px;
}

#form button {
	font-size: 9pt;
	border: 1px solid #ccc;
}

#form button:hover {
	background: #eef;
}

#map {
	height: 400px;
	margin: 0 0 10px;
	border: 5px solid #ccc;
}

#vifix {
	text-align: center;
}

#vifix a {
	color: #f00;
	text-decoration: none;
}

#vifix a:hover {
	color: #f96;
}
</style>
</head>
<body>
	<div id="frame">
		<div id="form">
			输入一个地址: <input id="address" value="北京理工大学"/>
			<button id="btn_go">获取坐标</button>
		</div>
		<div id="map"></div>
		<div id="info"></div>
	</div>
</body>
</html>