2010.02.24——google map api----定义地图显示边界
2010.02.24——google map api----定义地图显示边界
GLatLngBounds 定义显示边界
具体例子：
GLatLngBounds 定义显示边界
function initialize(){
if(GBrowserIsCompatible()){//判断浏览器兼容性
map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(34.6156,112.4450),13);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.enableScrollWheelZoom();
//定义矩形边界
var maprange = new GLatLngBounds(new GLatLng(35.6156,111.4450),new GLatLng(34.6156,113.4450));
GEvent.addListener(map,"dragend",function(){
checkBounds(maprange);
});
}
}
function checkBounds(maprange){
if(maprange.containsLatLng(map.getCenter())){
return;
}
var center = map.getCenter();
var x = center.lng();
var y = center.lat();
//取边界的各个顶点的经纬度
var maxX = maprange.getNorthEast().lng();
var maxY = maprange.getNorthEast().lat();
var minX = maprange.getSouthWest().lng();
var minY = maprange.getSouthWest().lat();
//
if(x<minX){x = minX};
if(x>maxX){x = maxX};
if(y<minY){y = minY};
if(y>maxY){y = maxY};
//当超过边界时 找到最近的边界定位
map.setCenter(new GLatLng(y,x));
}
具体例子：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>限制地图显示范围</title>
<script type="text/javascript" src="http://ditu.google.cn/maps?file=api&v=2&key=abcdefg&sensor=true_or_false"></script>
<script type="text/javascript">
var map;
function initialize(){
if(GBrowserIsCompatible()){//判断浏览器兼容性
/*
** 添加响应事件
**
*/
map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(34.6156,112.4450),13);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.enableScrollWheelZoom();
//定义矩形边界
var maprange = new GLatLngBounds(new GLatLng(35.6156,111.4450),new GLatLng(34.6156,113.4450));
//单击地图时弹出点击点的坐标
GEvent.addListener(map,"click",function(overlay,latlng){
if(latlng){
document.getElementById("tt").value = "经度："+latlng.lng()+"纬度："+latlng.lat();
}
});
GEvent.addListener(map,"dragend",function(){
checkBounds(maprange);
});
}
}
function checkBounds(maprange){
if(maprange.containsLatLng(map.getCenter())){
return;
}
var center = map.getCenter();
var x = center.lng();
var y = center.lat();
//取边界的各个顶点的经纬度
var maxX = maprange.getNorthEast().lng();
var maxY = maprange.getNorthEast().lat();
var minX = maprange.getSouthWest().lng();
var minY = maprange.getSouthWest().lat();
//
if(x<minX){x = minX};
if(x>maxX){x = maxX};
if(y<minY){y = minY};
if(y>maxY){y = maxY};
//当超过边界时 找到最近的边界定位
map.setCenter(new GLatLng(y,x));
}
</script>
</head>
<body onload = "initialize()" onunload = "GUnload()">
<div id="map_canvas" style="width:500px; height:500px;"> </div>
<input type="text" id="tt" maxlength="100"/>
</body>
</html>