百度地图添加自定义控件tp5.1

    //自定义控件
    function ZoomControl() {
        this.defaultAnchor = BMAP_ANCHOR_TOP_LEFT;
        this.defaultOffset = new BMap.Size(10,10);
    }
    //继承BMap.Control
    ZoomControl.prototype = new BMap.Control;
    //控件初始化
    ZoomControl.prototype.initialize = function (map) {
        var div = document.createElement('div');
        var big = document.createElement('span');
        var small = document.createElement('span');
        big.appendChild(document.createTextNode('放大2级'));
        small.appendChild(document.createTextNode('缩小2级'));
        div.appendChild(big);
        div.appendChild(small);
        big.style.marginRight= '10px';
        big.style.border = 'solid 1px blue';
        big.style.cursor = "pointer";

        small.style.cursor = "pointer";
        small.style.marginLeft = '10px';
        small.style.border = 'solid 1px red';
        //注册点击事件
        big.onclick = function () {
            map.zoomTo(map.getZoom()+2);
        };
        small.onclick = function () {
            map.zoomTo(map.getZoom()-2);
        }
        //添加控件到地图
        map.getContainer().appendChild(div);
        return div;
    };
    //添加自定义控件到地图
    var myZoomControl = new ZoomControl();
    map.addControl(myZoomControl);

猜你喜欢

转载自blog.csdn.net/qq_40095973/article/details/81258802