Question

在我的openlayers 5（基于angular 6应用程序）中，我实现了一种功能，其中您可以搜索某些内容，查询db，db返回一些geoJSON并将此geoJSON数据呈现在ol矢量层中。

有两种不同的搜索方式，因此有两种不同的形式将geoJSOn带回到相同的ol向量。

当然，在渲染数据之前，我必须清除该层。

这是我的代码

ngOnInit() {//initialize some params and the ol map
    //bring results-as you type - pure angular
    this.results = this.myForm.valueChanges.pipe(
      switchMap( formdata => this.mapcmsService.searchName(formdata.name, formdata.cepDrop))
    );//pipe

    this.tilesource = new OlXYZ({
      url:'http://tile.stamen.com/terrain/{z}/{x}/{y}.jpg'
    });

    this.tilelayer = new OlTileLayer({
      source: this.tilesource
    });

    this.vectorsource = new VectorSource({});

    this.vectorlayer = new VectorLayer({
      source: this.vectorsource
    });

    this.view = new OlView({
      center: OlProj.fromLonLat([6.661594, 50.433237]),
      zoom: 2,
    });

    this.olmap = new OlMap({
      target: 'map',
      layers: [this.tilelayer,this.vectorlayer],
      view: this.view,
      projection: 'EPSG:3857'
    });

    const selectClick = new Select({
      condition: click,
      layers:[this.vectorlayer]      
    });

    this.olmap.addInteraction(selectClick);    

    selectClick.on(
      'select', ()=>{     
        const values = selectClick.getFeatures().item(0).values_;
        this.getDetails(values.id);                
      }             
    );
} //closes ngOnInit

在ngOnInit之外，初始化之后，有两个不同的函数将geoJSON带到同一ol向量层。他们基本上做同样的事情。

  searchById(id){
    this.map_loading = true;    
    this.myService.getById(id).subscribe((data) =>{
        this.vectorsource.refresh();
        this.vectorsource.clear();
        const fff = (new GeoJSON()).readFeatures(data.data);
        this.vectorsource.addFeatures(fff);
        this.map_loading = false;
    })
  }//searchById

和

searchCategories(){
    this.map_loading = true;           
this.myService.categoriesSearch(this.categoriesForm.value).subscribe((data) =>{
        this.vectorsource.refresh();
        this.vectorsource.clear();
        const fff = (new GeoJSON()).readFeatures(data.data);
        this.vectorsource.addFeatures(fff);
        this.map_loading = false;
    })
  }//searchCategories

问题是在添加新功能之前，ol矢量源并不总是被清除。我搜索一些东西，特征被渲染。我再次搜索，有时旧的地图项与新的地图项一起保留在地图上。

我做了一个愚蠢的举动，将refresh与clean相加，但是没有任何固定的结果。这不是标准的，例如每隔一次搜索。这是随机发生的，我不知道如何调试它。请指教

谢谢

Answer 1

每个功能都有唯一的ID吗？

我遇到了一个问题，那就是不断加载功能。我使用了bbox-strategy，每次移动地图时，地图都会加载范围内的所有要素，即使它们已经存在。

我必须在数据中为我的功能设置一个唯一的ID，因此，如果您加载新的功能，则OpenLayers可以引用现有的功能。这种随机性可能是通过特征的生成ID产生的，有时与新ID相等，有时不相等。

不知道这是否遇到您的问题，当我读到它时它就飞进了我的大脑。

调用清除函数

1 个答案: