<!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>Google Map </title>
<script type="text/javascript" src="mapfiles/mapapi_3.12.9.js"></script>
<script type="text/javascript" src="js/gmap_exp.js"></script>
<script type="text/javascript" src="js/map_helper.min.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<!--弹出层控件-->
<link type="text/css" rel="stylesheet"href="images/popup_laye.css" />
<script type="text/javascript" src="js/popup_layer.js"></script>
<script type="text/javascript">
//封装操作对象
var maphelper = null;
//信息窗口
var infowindow = null;
var mapobj = null;
$(function() {
var mapCanvas = document.getElementById("map_canvas");
//地图选项
var myOptions = {
//初始缩放级别
zoom: 12,
//显示中心位置
center: new Array(117.209888, 31.852471),
//取消默认的控件
disableDefaultUI: false,
//缩放移动控件
navigationControl: true,
//街景
streetViewControl: false,
//地图类型控件
mapTypeControl: false,
//比例尺控件
scaleControl: true,
mapTypeId: OFFLINE_MAP,
mapPath:"maptile/yahoomaps/roadmap/",
};
maphelper = new mapHelper();
mapobj = maphelper.initMap(mapCanvas, myOptions);
maphelper.bindInstanceEvent(mapobj, 'mousemove', function(event){
$("#CLAT").val(event.latLng.lat());
$("#CLNG").val(event.latLng.lng());
});
maphelper.bindInstanceEvent(mapobj, 'zoom_changed', function(event){
$("#ZOOM").val(maphelper.getZoom());
});
var offset = $("#DIR_PANEL").offset();
x = -offset.left+3;
y = -(offset.top+$("#DIR_PANEL").height());
new PopupLayer({trigger:"#DIR_PANEL",popupBlk:"#blk",closeBtn:"#close",
offsets:{
x:x,
y:y
}
});
});
//指定地图缩放级别
function SetZoom() {
var level = $("#MAP_LEVEL").val();
maphelper.setZoom(level);
}
function MovePoint() {
var lat = $("#LAT").val();
var lng = $("#LNG").val();
var zoom = $("#ZOOM").val();
maphelper.movePoint(lng,lat,zoom);
var obj11 = maphelper.markerPoint({
lat: lat,
lng: lng
});
}
function FindPoint() {
var address = $("#ADDRESS").val();
maphelper.findPoint(address);
}
var marker1 = null;
function EventMarker() {
marker1 = maphelper.markerPoint({
lat: 31.852471,
lng: 117.209888,
title: '测试'
});
maphelper.bindInstanceEvent(marker1, 'click', toggleBounce);
//添加事件
/* var MapsEvent = new google.maps.event.addListener(marker, 'click',
function(event) {
//event:反馈事件信息, map:当前map对象, marker:标记点对象
toggleBounce(event, maphelper.map, marker);
});*/
}
function Flicker()
{
//marker1.setVisible(false);
marker1.setFlicker(true);
}
function ClearMarkerEvent()
{
maphelper.clearEvents();
}
function toggleBounce(event, map, marker) {
// alert(event.latLng);
// alert(getMethodAndPropertys(event));
//标记动画
if (marker.getAnimation() != null) {
marker.setAnimation(null);
} else {
marker.setAnimation(google.maps.Animation.BOUNCE);
}
var contentString = '<div id="content"><div></div><h1>我的标签</h1><div id="bodyContent"><p class = "mapStyle">当前位置 '
+ event.latLng + '<br><a href="http://www.google.com.hk" target="_blank">详细信息</a></div></div>' ;
if(infowindow)
infowindow.close();
infowindow = new google.maps.InfoWindow({ //根据HTML初始化infowindow
content: contentString
});
infowindow.open(map, marker);
}
function MarkerIcon() {
var content = '<div id="content">' + //点击标记后显示自定义的内容
'<div>' + '</div>' + '<h1>小汽车</h1>' + '<div id="bodyContent">' + '<p class = "mapStyle">当前位置 lat:31.852471, lng:117.229888<br><a href="http://www.google.com.hk" target="_blank">详细信息</a>' + '</div>' + '</div>';
var marker = maphelper.markerPoint({
lat: 31.852471,
lng: 117.229888,
title: '小汽车',
icon: "images/car.png"
});
maphelper.bindInstanceEvent(marker, 'mouseover',
function(event,map,marker) {
infowindow = new google.maps.InfoWindow({ //根据HTML初始化infowindow
content: content
});
infowindow.open(maphelper.map, marker);
}
);
maphelper.bindInstanceEvent(marker, 'mouseout',
function() {
if(infowindow)
infowindow.close();
}
);
// document.write(printObj(marker)) ;
}
var dots = Array();
function Polyline() {
ClearPoly();
alert("点击地图进行画线");
//画线坐标 维度,经度
var color = $("#COLOR").val();
var weight = $("#WEIGHT").val();
var opacity = $("#OPACITY").val();
maphelper.bindInstanceEvent(mapobj, 'click',
function(event) {
dots.push(new Array(event.latLng.lng(),event.latLng.lat()));
//画线
var poly = maphelper.polyline({
dots:dots,
color:color,
weight:weight,
opacity:opacity
});
$("#total_km").empty().text((poly.getLength()/1000).toFixed(3) + "km");
});
}
var polygon = null;
function Polygon() {
ClearPoly();
alert("点击地图进行绘制");
var color = $("#STROKE_COLOR").val();
var opacity = $("#STROKE_OPACITY").val();
var fcolor = $("#FILL_COLOR").val();
var fopacity = $("#FILL_OPACITY").val();
maphelper.bindInstanceEvent(mapobj, 'click',
function(event) {
dots.push(new Array(event.latLng.lng(),event.latLng.lat()));
//画多边形
if(dots.length == 1){
polygon = maphelper.polygon({
dots:dots,
color:color,
opacity:opacity,
fillcolor:fcolor,
fillopacity:fopacity
});
}else {
var path = polygon.getPath();
path.push(event.latLng);
polygon.setPath(path);
}
});
}
function ClearPoly() {
dots = [];
maphelper.clearPoly();
maphelper.clearLine();
$("#total_km").text("");
maphelper.clearInstanceEvent(mapobj, 'click');
}
function Circle()
{
ClearPoly();
alert("点击地图进行绘制");
var color = $("#STROKE_COLOR").val();
var opacity = $("#STROKE_OPACITY").val();
var fcolor = $("#FILL_COLOR").val();
var fopacity = $("#FILL_OPACITY").val();
maphelper.bindInstanceEvent(mapobj, 'click',
function(event) {
var circleObj = maphelper.circle({
lat:event.latLng.lat(),
lng:event.latLng.lng(),
color:color,
opacity:opacity,
fillcolor:fcolor,
fillopacity:fopacity,
radius: "1000"
});
});
}
function ShowLatLng(event)
{
var infoWindowPoly = new google.maps.InfoWindow();
var contentString = "<b>你点线啦</b><br />";
contentString += "点击位置: <br />" + event.latLng.lat() + "," +
event.latLng.lng() + "<br />";
//消息框内容
infoWindowPoly.setContent(contentString);
//消息框弹出位置
infoWindowPoly.setPosition(event.latLng);
//点击线的时候显示线的弹出框
infoWindowPoly.open(maphelper.map);
}
function printObj(obj) {
var result = [];
for (var id in obj) {
try {
if (typeof(obj[id]) == "function") {
result.push("function " + id + ": " + obj[id].toString());
} else {
result.push("property " + id + ": " + obj[id].toString());
}
} catch(err) {
result.p
googe离线地图demo （459个子文件） 
popup_laye.css 2KB crosshair.cur 4KB closedhand_8_8.cur 326B openhand_8_8.cur 326B
warning.gif 1KB iw_close.gif 76B iw_plus.gif 76B iw_minus.gif 73B
综合演示_离线地图.html 14KB jquery.js 91KB controls.js 62KB controls.js 57KB controls.js 55KB controls.js 54KB common.js 46KB common.js 45KB util.js 45KB util.js 45KB common.js 44KB util.js 42KB poly.js 42KB poly.js 42KB poly.js 42KB poly.js 38KB main.js 37KB main.js 36KB common.js 36KB main.js 36KB map.js 35KB map.js 35KB map.js 35KB main.js 35KB map.js 34KB directions.js 34KB util.js 33KB directions.js 31KB directions.js 30KB onion.js 23KB onion.js 23KB marker.js 22KB marker.js 22KB onion.js 21KB marker.js 21KB onion.js 20KB marker.js 19KB drawing_impl.js 13KB kml.js 11KB kml.js 11KB kml.js 11KB map_helper.min.js 10KB kml.js 10KB infowindow.js 10KB infowindow.js 10KB drawing_impl.js 10KB drawing_impl.js 10KB places_impl.js 10KB places_impl.js 9KB places_impl.js 9KB drawing_impl.js 9KB places_impl.js 9KB infowindow.js 7KB infowindow.js 7KB popup_layer.js 6KB geometry.js 5KB geometry.js 5KB geometry.js 5KB mapapi_3.9.12.js 5KB stats.js 4KB stats.js 4KB stats.js 4KB geometry.js 4KB usage.js 4KB usage.js 4KB usage.js 4KB usage.js 4KB stats.js 4KB mapapi_3.12.9.js 3KB mapapi_3.13.15.js 3KB mapapi_3.13.1.js 3KB geocoder.js 2KB search_impl.js 2KB search_impl.js 2KB search_impl.js 2KB geocoder.js 2KB geocoder.js 2KB distance_matrix.js 2KB distance_matrix.js 2KB distance_matrix.js 2KB places.js 2KB geocoder.js 2KB places.js 2KB places.js 2KB overlay.js 1KB overlay.js 1KB overlay.js 1KB overlay.js 1KB places.js 1KB elevation.js 1KB elevation.js 1KB elevation.js 1KB共 459 条
- 1
- 2
- 3
- 4
- 5
资源评论
wxgiter2015-09-13很有参考意义，多谢分享！
风度越2015-09-21很好 已经用上！
m9806875142015-09-06很不错的资源 感谢楼主分享
