标签：js javascript function 百度地图
若要转载请注明出处
本文为原创
作者：injuer
严禁用于商业用途,仅供学习交流
</pre><pre code_snippet_id="368934" snippet_file_name="blog_20140529_1_6382235" name="code" class="html"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
#container{
width:100%;
height:100%;
}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=*******"></script>
</head>
<body>
<div id="container"></div>
</body>
<script type="text/javascript">
var extMap = {
load : function(data, controls){
var map = new BMap.Map("container");
map.centerAndZoom(new BMap.Point(data.lng, data.lat), 12);
if(null != controls){
for(var i = 0; i < controls.length; i++){
map.addControl(controls[i]);
}
}
return map;
},
addData : function(map,data){
var marke = null;
var label = null;
var temp = null;
for(var i = 0; i < data.length; i++){
temp = data[i];
marke = new BMap.Marker(new BMap.Point(temp.lng, temp.lat));
marke.setTitle(temp.title);
if(null != temp.icon && "" != temp.icon){
marke.setIcon(new BMap.Icon(temp.icon, new BMap.Size(temp.icon_width, temp.icon_height)));
}
this.addMenu(marke, temp);
this.addMarkerEventListener(map, marke);
this.addLabel(map, marke, temp);
}
return map;
},
addMenu : function(marke, data){
var ms = data.menu;
var m = null;
m = new BMap.ContextMenu();
for(var i = 0; i < ms.length; i++){
m.addItem(new BMap.MenuItem(ms[i].root, ms[i].fun));
}
marke.addContextMenu(m);
},
addMarkerEventListener : function(map, marke){
marke.addEventListener("click", function(event){
var overs = map.getOverlays();
var point = null;
for(var i = 0; i < overs.length; i++){
if(overs[i] instanceof BMap.Label){
point = new BMap.Point(event.target.getPosition().lng - 0.5 / 1000, event.target.getPosition().lat);
if(point.equals(overs[i].getPosition())){
overs[i].show();
}else{
overs[i].hide();
}
}
}
});
map.addOverlay(marke);
},
addLabel : function(map, marke, data){
label = new BMap.Label(data.text);
label.setPosition(new BMap.Point(data.lng - 0.5 / 1000, data.lat));
label.hide();
map.addOverlay(label);
}
}
var data = new Array();
for(var i = 0; i < 3; i++){
data.push({
lng : 102.711 + (i /1000),
lat : 25.05,
icon : null,
text : "这是内容",
title : "这是标题",
icon_width : 0,
icon_height : 0,
menu : [
{
root : "根目录0",
fun : function(){
alert("点击了根目录0");
},
},
{
root : "根目录1",
fun : function(){
alert("点击了根目录1");
}
},
{
root : "根目录2",
fun : function(){
alert("点击了根目录2");
}
}
]
});
}
var map = extMap.addData(extMap.load(data[0], [
new BMap.ScaleControl(),
new BMap.OverviewMapControl(),
new BMap.NavigationControl()
]), data);
</script>
</html>
标签：js javascript function 百度地图
原文地址：http://blog.csdn.net/injuer/article/details/27539473
