百度地圖自定義控件分享
更新時間:2015年03月04日 09:25:06 投稿:hebedich
本文給大家介紹的是如何使用百度地圖的自定義控件,附上示例,分享給大家,小伙伴們根據(jù)自己的需求稍微改動下即可使用。
廢話不多說了,直接奉上代碼;
復(fù)制代碼 代碼如下:
<script>
var map = new BMap.Map('allmap');
var Bcenter = new BMap.Point(116.404,39.915);
map.centerAndZoom(Bcenter,11);
//自定義控件
function staticControl(){
this.defaultAnchor = BMAP_ANCHOR_TOP_LEFT;
this.defaultOffset = new BMap.Size(10,10);
}
//繼承Control的API
staticControl.prototype = new BMap.Control();
//初始化控件
staticControl.prototype.initialize=function(map){
var div = document.createElement('div');
var e1 = document.createElement('input');
e1.type = 'button';
e1.value = '重置';
e1.onclick=function(){
statics();
}
div.appendChild(e1);
var e2=document.createElement('input');
e2.type = 'button';
e2.value = '縮小';
e2.onclick=function(){
endStatics();
}
div.appendChild(e2);
var e3 = document.createElement("input");
e3.type = "button";
e3.value = "放大";
e3.onclick = function () {
setStatics();
}
div.appendChild(e3);
//添加DOM元素到地圖中
map.getContainer().appendChild(div);
//返回DOM
return div;
}
//創(chuàng)建控件實例
var staticsCtrl = new staticControl();
//添加到地圖當中
map.addControl(staticsCtrl);
function statics(){
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
}
function endStatics(){
map.setZoom(map.getZoom()-2);
}
function setStatics(){
map.setZoom(map.getZoom()+2)
}
</script>
上面代碼就是個人正在使用的百度地圖的自定義控件,希望大家能夠喜歡。
相關(guān)文章
基于JavaScript實現(xiàn)跳轉(zhuǎn)提示頁面
這篇文章主要介紹了基于JavaScript實現(xiàn)跳轉(zhuǎn)提示頁面 的相關(guān)資料,需要的朋友可以參考下2016-09-09詳解使用Next.js構(gòu)建服務(wù)端渲染應(yīng)用
這篇文章主要介紹了詳解使用Next.js構(gòu)建服務(wù)端渲染應(yīng)用,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-07-07[Web]防止用戶復(fù)制頁面內(nèi)容和另存頁面的方法
原理就是利用js控制一些復(fù)制等事件,但破解也簡單,這里就不說了。2009-02-02