• 百度地图自定义覆盖物


        <script>
        var map = new BMap.Map('allmap');
        var Bcenter = new BMap.Point(116.404,39.915);
        map.centerAndZoom(Bcenter,11);
        
        //自定义的覆盖物
        function myOverlay(point,text,mouseoverText){
            this._point = point;
            this._text = text;
            this._overtext = mouseoverText;
        }
        
        //继承overlay的API
        myOverlay.prototype = new BMap.Overlay();
         
        //初始化自定义覆盖物
        myOverlay.prototype.initialize = function(map){
            this._map = map;
            //创建div标签
            var div = this._div = document.createElement('div');
            div.style.position = 'absolute';
            div.style.zIndex = BMap.Overlay.getZIndex(this._point.lat);
            div.style.backgroundColor = '#EE5D5B';
            div.style.border = '1px solid #BC3B3A';
            div.style.color = 'white';
            div.style.height = '18px';
            div.style.padding = '2px';
            div.style.lineHeight = '18px';
            div.style.whiteSpace = 'nowrap';
            div.style.MozUserSelect = 'none';
            div.style.fontSize = '12px';
            //创建span标签
            var span = this._span = document.createElement('span');
            div.appendChild(span);
            span.appendChild(document.createTextNode(this._text));
            var that = this;
            
            //箭头的穿件
            var arrow = this._arrow = document.createElement('div');
            arrow.style.background = "url(http://map.baidu.com/fwmap/upload/r/map/fwmap/static/house/images/label.png) no-repeat";
            arrow.style.position = "absolute";
            arrow.style.width = "11px";
            arrow.style.height = "10px";
            arrow.style.top = "22px";
            arrow.style.left = "10px";
            arrow.style.overflow = "hidden";
            div.appendChild(arrow);
            //标签绑定事件
        /*div.onmouseover = function(){
                this.style.backgroundColor = "#6BADCA";
                this.style.borderColor = "#0000ff";
                this.getElementsByTagName("span")[0].innerHTML = that._overtext;
                arrow.style.backgroundPosition = "0px -20px";
            }
    
            div.onmouseout = function(){
                this.style.backgroundColor = "#EE5D5B";
                this.style.borderColor = "#BC3B3A";
                this.getElementsByTagName("span")[0].innerHTML = that._text;
                arrow.style.backgroundPosition = "0px 0px";
            }
            */
            //添加到覆盖物的容器中
            map.getPanes().labelPane.appendChild(div);
            return div;
        }
        
        //绘制覆盖物
        myOverlay.prototype.draw = function(){
            var map = this._map;
            var pixel = map.pointToOverlayPixel(this._point);
            this._div.style.left = pixel.x - parseInt(this._arrow.left) + 'px';
            this._div.style.top = pixel.y - 30 + 'px';
        }
        
        //覆盖物显示
        myOverlay.prototype.show = function(){
            if(this._div){
                this._div.style.display = '';
            
            }
        }
        
        //隐藏覆盖物
        myOverlay.prototype.hide = function(){
            if(this._div){
                this._div.style.display = 'none';
            }
        }
        
        //自定义覆盖物添加事件
        myOverlay.prototype.addEventListener = function (event, fun) {
            this._div['on' + event] = fun;
        
        }
        
        var myoverlay = new myOverlay(Bcenter,'鼠标上来看看','鼠标下去看看');
        map.addOverlay(myoverlay);
        myoverlay.addEventListener('click',function(){
            alert('注册点击事件');
        })
        </script>
    View Code
  • 相关阅读:
    LeetCode347 前k个高频元素
    剑指42 连续字数租的最大和
    hdu1540
    hdu4553 两棵线段树
    cdq分治
    负环
    最短路
    差分约束系统
    hdu3308
    hdu5862 树状数组+扫描线+离散化
  • 原文地址:https://www.cnblogs.com/ikasa007/p/4310612.html
Copyright © 2020-2023  润新知