当前位置：首页 > article >正文

openlayer getLayerById 根据id获取layer图层

article 2025/1/27 3:04:51

背景：

在项目中使用getLayerById获取图层，这个getLayerById()方法不是openlayer官方文档自带的，而是自己封装的一个方法，这个封装的方法的思路是：遍历所有的layer，根据唯一标识【可能是id，也可能是name，这是自定义的】即可获取带相应的图层。

唯一标识是在addlayer加载图层时候，通过layer.set('自定义的唯一标识'，'...自定义属性值')。在获取图层时，通过layer.get('自定义的唯一标识')即可获取到相应的图层。

官网链接：点击跳转官网

getLayerById()官网不存在此方法！

例如：

第1步：创建一个layer

const param =

{

layer: true,

id: "TDT_DITU",

title: "天地图",

visible: false,

source: "XYZ",

url: "http://t{0-7}.tianditu.gov.cn/DataServer/tianditu?T=vec_w&x={x}&y={y}&l={z}&tk=1575c31672124b57f214b65928540083",

zIndex: 7,

},

let _layer = new TileLayer({

title: param.title,

source: new XYZ({

url: param.url,

}),

visible: param.visible,

});

_layer .setZIndex(param.zIndex);

map.addLayer(_layer );

第2步：设置唯一标识，这里用id

_layer.set('layerId','TDT_DITU')

第3步：根据id获取地图图层

_layer.get('layerId');//备注：看看返回的是不是等于自定义的属性'TDT_DITU'，如果是，

第...步：

使用getLayers()方法找到地图上所有图层【getLayers()是openleyer官网的方法】

let allLayers = map.getLayers().array_;//所有图层

大概思路如上：

项目中实际代码：

const layerVisible = user.map.layer.getLayerById('location')

                {
                title: '临时图层',
                type: 'temporary',
                isShow: false,
                layers: [
                    {
                        layer: true,
                        id: 'location',
                        title: '定位图层',
                        visible: true,
                        source: 'Vector',
                        zIndex: 10,
                        isDeclutter: true
                    },

getLayerById()封装代码：

// 根据id查找图层是否开启
    getLayerById(id) {
        for (let i = 0; i <= this.config.length - 1; i++) {
            const index = this.config[i].layers.findIndex(el => el.children)
            if (index !== -1) {
                const layer_item = 
                    this.config[i].layers[index].children.find(el => el.id === id)
                if (layer_item) {
                    return layer_item.visible
                }
            } else {
                const item = this.config[i].layers.find(el => el.id === id)
                if (item) {
                    return item.visible
                }
            }
        }
    }

其它：