<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Google Maps JavaScript API v3 Example: Image MapTypes</title>
<link href="mapfiles/css/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="mapapi.js"></script>
<style type="text/css">
.infowindow_table {background-color:#dddddd}
.infowindow_table td {background-color:#ffffff}
</style>
<script>
function tlen(len, mystr){
mystr = String(mystr);
var num = len - mystr.length;
for (var i = 0; i <= num; i++)
{
mystr = "0" + mystr;
}
return mystr;
};
function CoordMapType(tileSize) {
this.tileSize = tileSize;
}
/*
//显示瓦片边框线、文件对应x、y、缩放等级
CoordMapType.prototype.getTile = function(coord, zoom, ownerDocument) {
var div = ownerDocument.createElement('DIV');
var ymax = 1 << zoom;
var y = coord.y;
y = tlen(5,y);
var x = tlen(5,coord.x);
zoom = tlen(1,zoom);
div.innerHTML = y + "," + x + "," + zoom;
div.style.width = this.tileSize.width + 'px';
div.style.height = this.tileSize.height + 'px';
div.style.fontSize = '10';
div.style.borderStyle = 'solid';
div.style.borderWidth = '1px';
div.style.borderColor = '#789789';
return div;
};*/
//卫星地图 相关参数
function LocalMapType() {}
LocalMapType.prototype.tileSize = new google.maps.Size(256, 256);
LocalMapType.prototype.maxZoom = 19;
LocalMapType.prototype.minZoom = 1;
LocalMapType.prototype.name = "卫星地图";
LocalMapType.prototype.alt = "显示卫星地图";
var localMapType = new LocalMapType();
localMapType.getTile = function(coord, zoom, ownerDocument) {
var img = ownerDocument.createElement("img");
img.style.width = this.tileSize.width + "px";
img.style.height = this.tileSize.height + "px";
var ymax = 1 << zoom;
var y = coord.y;
y = tlen(5,y);
var x = tlen(5,coord.x);
zoom = tlen(1,zoom);
var strURL = "data_wx"+"\\L" + zoom + "\\" + y + "-" + x + ".png";
img.src = strURL;
return img;
};
//电子地图 相关参数
function LocalMapType2() {}
LocalMapType2.prototype.tileSize = new google.maps.Size(256, 256);
LocalMapType2.prototype.maxZoom = 19;
LocalMapType2.prototype.minZoom = 1;
LocalMapType2.prototype.name = "电子地图";
LocalMapType2.prototype.alt = "显示电子地图";
var localMapType2 = new LocalMapType2();
localMapType2.getTile = function(coord, zoom, ownerDocument) {
var img = ownerDocument.createElement("img");
img.style.width = this.tileSize.width + "px";
img.style.height = this.tileSize.height + "px";
var ymax = 1 << zoom;
var y = coord.y;
y = tlen(5,y);
var x = tlen(5,coord.x);
zoom = tlen(1,zoom);
var strURL = "data"+"\\L" + zoom + "\\" + y + "-" + x + ".png";
img.src = strURL;
return img;
};
var myLatlng ;//初始中心点
var map;//地图对象
var centerLatLng=new google.maps.LatLng(70.71503758033349, -33.30230712890625);//中心点（中山）
var marker;//标记
var infowindow_bymarker = new google.maps.InfoWindow();
var infowindow_bypolygon = new google.maps.InfoWindow();
var i=1;
function initialize() {
var myOptions = {
center:centerLatLng,
zoom: 12,
streetViewControl: false, //街景视图街景小人控件
scaleControl:true, //比例尺
mapTypeControlOptions: {
//mapTypeIds: ["local", google.maps.MapTypeId.ROADMAP]
mapTypeIds: ["local","local2"]
}
};
map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
map.mapTypes.set('local', localMapType);//添加卫星地图
map.mapTypes.set('local2', localMapType2);//添加电子地图
map.setMapTypeId('local');
//map.overlayMapTypes.insertAt(0, new CoordMapType(new google.maps.Size(256, 256)));
//地图对象map单击事件
google.maps.event.addListener(map, 'click', function(event) {
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n触发了地图对象map的click单击事件";
//输出坐标代码
/*
document.getElementById("txtMap").innerHTML=
document.getElementById("txtMap").innerHTML+
"new google.maps.LatLng"+event.latLng+",";
*/
document.getElementById("txtMap").innerHTML=
document.getElementById("txtMap").innerHTML+
"\nnew google.maps.LatLng"+event.latLng+",";
i=i+1;
});
//地图对象map双击事件
google.maps.event.addListener(map, 'dblclick', function(event) {
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n触发了地图对象map的dblclick双击事件";
});
//地图对象mousemove鼠标移动事件
google.maps.event.addListener(map, 'mousemove', function(event) {
/*
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n触发了地图对象map的mousemove鼠标移动事件";
*/
});
//地图对象mouseout鼠标移出事件
google.maps.event.addListener(map, 'mouseout', function(event) {
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n触发了地图对象map的mouseout鼠标移出事件";
});
//地图对象mouseover鼠标移入事件
google.maps.event.addListener(map, 'mouseover', function(event) {
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n触发了地图对象map的mouseover鼠标移入事件";
});
//地图对象zoom_changed缩放级别改变事件
google.maps.event.addListener(map, 'zoom_changed', function(event) {
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n触发了地图对象map的zoom_changed缩放级别改变事件";
});
//地图对象rightclick右键单击事件
google.maps.event.addListener(map, 'rightclick', function(event) {
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n触发了地图对象map的rightclick右键单击事件";
});
//地图对象center_changed中心点改变事件
google.maps.event.addListener(map, 'center_changed', function(event) {
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n触发了地图对象map的center_changed中心点改变事件";
});
}
//设置中心点
function setcenter(){
map.setCenter(centerLatLng);
}
//设置放大级别
function setZoom(){
map.setZoom(13);
}
//添加标记
function setMap(){
marker=new google.maps.Marker({
position:centerLatLng,
animation:google.maps.Animation.BOUNCE //运动标记
});
marker.setMap(map);
//地图标记marker单击事件
google.maps.event.addListener(marker, 'click', function(event) {
var s="触发了标记marker的click单击事件";
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n"+s;
infowindow_bymarker.close();
infowindow_bymarker.setContent(s);
infowindow_bymarker.open(map,marker);
});
//地图标记marker双击事件
google.maps.event.addListener(marker, 'dblclick', function(event) {
var s="触发了标记marker的dblclick双击事件";
document.getElementById("txtMsg").innerHTML=
document.getElementById("txtMsg").innerHTML+
"\n"+s;
infowindow_bymarker.close();
infowindow_bymarker.setContent(s);
infowindow_bymarker.open(map,marker);
});
//地图标记marker鼠标移出事件
google.maps.event.addListener(marker, 'mouseout', f
GoogleMap离线Api例子
需积分: 34 44 浏览量
2015-11-06
16:59:12
上传
评论
收藏 12.77MB ZIP 举报
GoogleMap离线Api例子 （194个子文件） 
openhand_8_8.cur 326B closedhand_8_8.cur 326B
iw_close.gif 76B
Example_GoogleMapAPI.html 123KB query_historipolyline.html 7KB map-simple-google.html 4KB historicaldataList.html 923B map-simple.html 864B video_window.html 208B controls.js 50KB main.js 48KB common.js 30KB places_impl.js 28KB map.js 26KB onion.js 19KB marker.js 18KB poly.js 18KB util.js 15KB kml.js 10KB infowindow.js 7KB mapapi.js 4KB stats.js 3KB geometry.js 3KB style.js 2KB geocoder.js 2KB usage.js 2KB overlay.js 1KB layers.js 503B maxzoom.js 467B
000111-000208.png 157KB 000222-000417.png 157KB 000445-000834.png 149KB 001783-003336.png 147KB 000890-001668.png 145KB 001788-003339.png 144KB 000445-000833.png 144KB 000892-001668.png 144KB 000891-001668.png 144KB 000446-000834.png 143KB 001782-003336.png 142KB 000892-001667.png 142KB 001784-003338.png 141KB 000222-000416.png 139KB 001784-003337.png 139KB 000890-001669.png 139KB 001783-003335.png 138KB 001781-003337.png 138KB 000445-000835.png 137KB 000891-001667.png 137KB 000892-001669.png 137KB 001782-003337.png 135KB 001784-003336.png 135KB 001785-003337.png 134KB 001782-003335.png 134KB 000893-001669.png 132KB 000894-001668.png 132KB 001783-003337.png 132KB 000447-000834.png 131KB 000055-000104.png 130KB 001784-003335.png 130KB 000223-000417.png 130KB 001781-003338.png 130KB 001782-003339.png 129KB 001788-003337.png 129KB 000894-001669.png 128KB 001783-003338.png 127KB 001787-003338.png 127KB 000893-001668.png 126KB 001787-003339.png 125KB 000446-000833.png 124KB 001784-003339.png 124KB 000223-000416.png 124KB 000891-001669.png 122KB 001785-003336.png 122KB 000003-000006.png 120KB 001786-003339.png 120KB 001782-003338.png 119KB 001787-003337.png 118KB 001786-003337.png 117KB 000013-000026.png 116KB 000027-000052.png 116KB 000006-000013.png 116KB 001783-003339.png 116KB 001785-003338.png 114KB 000222-000417.png 114KB 001785-003339.png 113KB 001786-003336.png 112KB 001783-003340.png 111KB 001788-003338.png 111KB 001786-003338.png 110KB 000001-000003.png 110KB 001786-003340.png 100KB 000000-000001.png 98KB 000446-000835.png 97KB 000111-000208.png 95KB 000891-001670.png 93KB 000000-000000.png 93KB 001784-003340.png 91KB 000013-000026.png 90KB 001789-003338.png 90KB共 194 条
- 1
- 2
资源评论
