<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>電子地圖</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=mykey"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var map = false;
var geocoder = new GClientGeocoder(); //解譯程式
var address = "中山北路2段52號";
//geocoder.getLatLng(address, showMark);
function showMark(point) {
if (!point) {
alert("Not found.");
} else {
map.setCenter(point, 16);
var marker = new GMarker(point);
map.addOverlay(marker);
marker.openInfoWindowHtml("<table border=\"0\" style=\"margin-top:10px;\"><tr><td>查詢位置</td><td>"+address+"</td></tr><tr><td>座標</td><td>"+point+"</td></tr></table>");
}
}
function init(){
if(GBrowserIsCompatible()){
map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(25.029075,121.520034), 15);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
}
}
//]]>
</script>
</head>
<body onload="init();">
<center>
<div style="width: 963px;text-align:left;">
<input id="searcht" type="text" /><input type="button" value="搜尋" onclick="address=document.getElementById('searcht').value;geocoder.getLatLng(address, showMark);"/>
<div id="map" style="width: 100%; height: 600px">
</div>
</div>
</center>
</body>
</html>
Posts
