openlayers 2实现vector图层文字标注

最新推荐文章于 2025-06-22 11:51:27 发布

原创

最新推荐文章于 2025-06-22 11:51:27 发布 · 7.5k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#openlayers #标注 #注记 #文字注记 #地图注记

图层绑定要素属性实现文字标注，注意是openlayers2不是3
大概的思路是，继承OpenLayers.Layer.Vector，监听图层添加要素的事件，创建dom节点，添加到map的容器之中，同时地图放大缩小，文字标注跟随移动（根据分辨路重新计算位置），图层移除要素，移除标注;
初始化

/**
     * Constructor: OpenLayers.Layer.E_Vector
     */
    initialize : function(layerName,options) {
        OpenLayers.Layer.Vector.prototype.initialize.apply(this,arguments);
        this.annotations = [];  
    },

创建标注

/**
     * 创建标注
     * @param data
     */
    createAnnotation :function(data){
        if(!this.annotationsVisible && data.feature.layer != this)return;
        if(data.feature.attributes != null
            && data.feature.attributes.annotationDisplay != null
            && data.feature.att