代碼:!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN"

!DOCTYPE html "-//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>Google Maps JavaScript API Example</title>
<script src="http://ditu.google.cn/maps?file=api&v=2&key=abcdefg&sensor=true_or_false"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var map;
var i=true;
function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(22.5, 113.9), 8);
GEvent.addListener(map, "moveend", function(){
var center = map.getCenter();
var latField = document.getElementById("textLat");
var lngField = document.getElementById("textLng");
latField.value = center.lat();
lngField.value = center.lng();
});
/* var geoPoint0 = new GLatLng(22.5, 113.9);
var marker0 = new GMarker(geoPoint0);
map.addOverlay(marker0);

var geoPoint1 = new GLatLng (23.7, 114.4);
//var marker1 = ;
map.addOverlay(new GMarker(geoPoint1));*/
}


map.addControl(new GLargeMapControl());
map.addControl(new GMenuMapTypeControl() );
// map.addmaptype(map.mousemove(latlng:GLatLng)) ;
// document.form1.textfield.value=map.getBounds();

}

function getLatLng(event)
{
if( !map) return;
var e = event ? event : window.event;
var container = document.getElementById("map_canvas");
var x = event.clientX - container.offsetLeft;
var y = event.clientY - container.offsetTop;
var gPoint = new GPoint(x, y);
var latLng = map.fromContainerPixelToLatLng(gPoint);
var latField = document.getElementById("textLat");
var lngField = document.getElementById("textLng");
latField.value = latLng.lat();
lngField.value = latLng.lng();
}

function getXY()
{
var container = document.getElementById("map_canvas");
var x = container.offsetLeft;
var y = container.offsetTop;
alert(x);
while(container = container.parentNode)
{
if(container.tagName == "body" || container.tagName == "BODY") break;
x += container.offsetLeft;
y += container.offsetTop;
}
alert(x);
}

function move()
{
map.panTo(new GLatLng(22.5, 113.9), 12);
//map.panTo(new GLatLng(,), 12);
}

function change(event)
{
if(!i)
map.setMapType(G_NORMAL_MAP);
else
map.setMapType(G_SATELLITE_MAP);
i=!i;
}

function getpoint()
{

}

</script>

</head>
<body onload="initialize()" onunload="GUnload()">


<div id="map_canvas" style="width:800px; height:600px" onmousemove="getLatLng(event)"></div>

<input type="button" value="測試" onclick="getXY()"/>
<form name="form1">
<p>
<label></label>
維度:<input type="text" readonly="true" id="textLat" />
<input type="button" value="返回地圖初始點" onclick="move()" />
<br />
精度:<input type="text" readonly="true" id="textLng" />
<input type="button" value=" 切換地圖模式 " onclick="change()"/>
</p>
</form>

</body>
</html>

敲的很辛苦,留個言吧
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章