百度地图api之创建自定义控件

百度地图api,创建自定义控件
创建百度地图代码省略,直接上创建控件代码

  1. js里边添加控件代码
/**
  * 自定义控件
  */
        function addTitle(){
            function zoomControl(){
                this.defaultAnchor = BMAP_ANCHOR_TOP_RIGHT;
                this.defaultOffset = new BMap.Size(300,0);
            }
            // 集成Control类
            zoomControl.prototype = new BMap.Control();
            // 实现initialize方法
            zoomControl.prototype.initialize = function(map){
                // 创建一个DOM元素
                var div = document.getElementById("title");
                // 添加DOM元素到地图中
                map.getContainer().appendChild(div);
                return div;
            }
            // 创建控件
            var myZoomCtrl = new zoomControl();
            map.addControl(myZoomCtrl);
        }// 自定义控件添加完成
  1. html页面定义div
    html页面div编写跟百度地图同一个级别
//id 对应 创建控件 getElementById里边的 title 控件显示内容
``

3.控件样式可以在css里边配置


百度地图api之创建自定义控件_第1张图片

你可能感兴趣的:(前端js,百度地图api创建自定义控件)