openlayer 添加唯一 id ts 报错，想要根据 id 删除指定图层？

Question

const tileLayer = new TileLayer({
  // 设置图层的属性和参数
  source: new XYZSource({
    // 设置瓦片源的属性和参数
    url: 'https://...',
  }),
  id: 'myTileLayer' // 设置唯一的 ID
});

Answer 1

试试

const tileLayer = new ol.layer.Tile({
  // 设置图层的属性和参数
  source: new ol.source.XYZ({
    // 设置瓦片源的属性和参数
    url: 'https://...',
  }),
});
  // 设置唯一id，set 方法可以添加任何属性
tileLayer.set('id', 'myTileLayer');
  // 将图层添加到地图
map.addLayer(tileLayer);


/** 删除指定 ID 的 TileLayer 图层 */
function removeTileLayerById(id) {
  map.getLayers().forEach(function(layer) {
    if (layer instanceof ol.layer.Tile && layer.get('id') === id) {
      map.removeLayer(layer);
    }
  });
}

// 调用函数删除指定 ID 的 TileLayer 图层
removeTileLayerById('myTileLayer'); 

知识点：

setProperties() 和 set() 都是用于设置要素属性的两种不同方法
1、setProperties() 方法接受一个包含要素属性和对应值的对象作为参数，取值 getProperties()。
2、set() 方法可以接受属性名和属性值作为两个独立的参数，取值 get()。
--------------------------------------------------------
1、使用 setProperties() 方法时，传入的对象会覆盖原有的属性值。如果对象中包含一些之前不存在的属性，它们将被添加到要素的属性集中。
2、使用 set() 方法时，每次调用都会替换指定属性的值，而不会影响其他属性。
例如：
// 使用 set() 方法设置单个属性
tileLayer.set('id', 'myTileLayer');

// 使用 setProperties() 方法设置多个属性
tileLayer.setProperties({
  id: 'myTileLayer',
  name: '这是个layer',
});