百度地图API自定义地�?/title>
<!--引用百度地图API-->
<style type="text/css">
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.1&services=true"></script>
</head>
<body>
<script>
(function(){
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
}
else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
<h1><a href="/" target="_blank">威尼斯8040|手机客户端</a></h1>
<!--百度地图容器-->
<div style="width:697.px;height:350px;border:#ccc solid 1px;" id="dituContent"></div>
</body>
<script type="text/javascript">
//创建和初始化地图函数�?
function initMap(){
createMap();//创建地图
setMapEvent();//设置地图事件
addMapControl();//向地图添加控�?
addMarker();//向地图中添加marker
}
//创建地图函数�?
function createMap(){
var map = new BMap.Map("dituContent");//在百度地图容器中创建一个地�?
var point = new BMap.Point(120.631416,31.381815);//定义一个中心点坐标
map.centerAndZoom(point,17);//设定地图的中心点和坐标并将地图显示在地图容器�?
window.map = map;//将map变量存储在全局
}
//地图事件设置函数�?
function setMapEvent(){
map.enableDragging();//启用地图拖拽事件，默认启�?可不�?
map.enableScrollWheelZoom();//启用地图滚轮放大缩小
map.enableDoubleClickZoom();//启用鼠标双击放大，默认启�?可不�?
map.enableKeyboard();//启用键盘上下左右键移动地�?
}
//地图控件添加函数�?
function addMapControl(){
//向地图中添加缩放控件
var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
map.addControl(ctrl_nav);
//向地图中添加缩略图控�?
var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1});
map.addControl(ctrl_ove);
//向地图中添加比例尺控�?
var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
map.addControl(ctrl_sca);
}
//标注点数�?
var markerArr = [{title:"威尼斯8040 ",content:"地址：苏州市相城区采莲路1088号（地铁2号线徐图港站1a号出口）",point:"120.631263|31.381322",isOpen:0,icon:{w:23,h:25,l:46,t:21,x:9,lb:12}}
];
//创建marker
function addMarker(){
for(var i=0;i<markerArr.length;i++){
var json = markerArr[i];
var p0 = json.point.split("|")[0];
var p1 = json.point.split("|")[1];
var point = new BMap.Point(p0,p1);
var iconImg = createIcon(json.icon);
var marker = new BMap.Marker(point,{icon:iconImg});
var iw = createInfoWindow(i);
var label = new BMap.Label(json.title,{"offset":new BMap.Size(json.icon.lb-json.icon.x+10,-20)});
marker.setLabel(label);
map.addOverlay(marker);
label.setStyle({
borderColor:"#808080",
color:"#333",
cursor:"pointer"
});
(function(){
var index = i;
var _iw = createInfoWindow(i);
var _marker = marker;
_marker.addEventListener("click",function(){
this.openInfoWindow(_iw);
});
_iw.addEventListener("open",function(){
_marker.getLabel().hide();
})
_iw.addEventListener("close",function(){
_marker.getLabel().show();
})
label.addEventListener("click",function(){
_marker.openInfoWindow(_iw);
})
if(!!json.isOpen){
label.hide();
_marker.openInfoWindow(_iw);
}
})()
}
}
//创建InfoWindow
function createInfoWindow(i){
var json = markerArr[i];
var iw = new BMap.InfoWindow("<b class='iw_poi_title' title='" + json.title + "'>" + json.title + "</b><div class='iw_poi_content'>"+json.content+"</div>");
return iw;
}
//创建一个Icon
function createIcon(json){
var icon = new BMap.Icon("http://api.map.baidu.com/lbsapi/creatmap/images/us_mk_icon.png", new BMap.Size(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size(json.x,json.h)})
return icon;
}
initMap();//创建和初始化地图
</script>
</html>
<div class="crumbs">
<div style="width:1000px;margin:0 auto;display:block;">
<p>当前位置:</p><p><img src="tpl/LjimitateIm/images/crumbs.png"></p><a href="index.html"><p>网站首页</p></a><p>></p><p>联系我们</p>
</div>
</div>
<div class="contacttp">
<img src="tpl/LjimitateIm/images/contact.png">
</div>
<div style="width:1000px;margin:0 auto;display:block;">
<img src="/data/editor/attached/image/20190603/20190603112026_34741.png" alt="" /><br />
</div>
<div class="contact_main">
<img src="">
</div>
</div>
<div class="foot">
<div class="foot_all">
<div class="foot_zuo fl">
<ul>
<li style="color:white;font-size:13px;line-height:13px;margin-top:6px;font-weight:bold;">1818vip威尼斯</li>
<li style="width:20px;"><hr style="color:white;size;1px;width:19px;margin-top:21px;"></li>
<a href="about.html" target="_blank"><li>公司简介</li></a>
<a href="culture.html" target="_blank"><li>企业文化</li></a>
<a href="honor.html" target="_blank"><li>荣誉资质</li></a>
<a href="contact.html" target="_blank"><li>联系方式</li></a>
</ul>
<ul>
<li style="color:white;font-size:13px;line-height:13px;margin-top:6px;font-weight:bold;">必威betway中文版</li>
<li style="width:20px;"><hr style="color:white;size;1px;width:19px;margin-top:21px;"></li>
<a href="case.php?cid=1" target="_blank"><li>厂房办公装饰工程</li>
<a href="case.php?cid=2" target="_blank"><li>医院装饰工程</li>
<a href="case.php?cid=3" target="_blank"><li>商城/别墅/酒店装饰工程</li>
<a href="case.php?cid=4" target="_blank"><li>古建装饰工程</li>
</ul>
<ul>
<li style="color:white;font-size:13px;line-height:13px;margin-top:6px;font-weight:bold;">联系我们</li>
<li style="width:20px;"><hr style="color:white;size;1px;width:19px;margin-top:21px;"></li>
<a href="contact.html" target="_blank"><li>电子地图</li>
<a href="contact.html" target="_blank"><li>联系方式</li>
</ul>
</div>
<div class="foot_zhong">
<p style="margin-top:12px">电话 : (86)-512-62769889</p>
<p>邮编 : 215131</p>
<p>邮箱 : ted@szted.com</p>
<p>地址 : 苏州市相城区采莲路1088号</p>
<p style="font-weight:bold;font-size:14px;line-height:center;">分享到 :
<img style="vertical-align:middle;" src="tpl/LjimitateIm/images/qq.png">
<img style="vertical-align:middle;" src="tpl/LjimitateIm/images/vx.png">
<img style="vertical-align:middle;" src="tpl/LjimitateIm/images/vb.png">
</p>
</div>
<div class="foot_you">
<img src="tpl/LjimitateIm/images/ma.png">
<p>扫一扫,关注我们</p>
</div>
</div>
<div style="width:1000px;height:1px;margin:0 auto;border-bottom: 1px solid #7d7d7d"></div>
<div class="foot_f">
<div class="link fl">
<p>友情链接：友情链接丨友情链接丨友情链接丨友情链接丨友情链接</p>
</div>
<div class="xx fr">
<p>Copyright©威尼斯8040 备案号:<a href="https://beian.miit.gov.cn/" target="_blank"><span style="color:#FFFFFF;">苏ICP备20041147号-1</span></a> </p>
</div>
</div>
</div>
</body>
</html>