Openlayers 4.6.5 и Angular 6 не могут удалять нарисованные фигуры в пикселях - PullRequest
0 голосов
/ 07 января 2019

Проблема в том, что при попытке удалить функцию this.vectorLayer.getSource().removeFeature() выдает ошибку Cannot read property 'forEach' of undefined

Я могу зарегистрировать функцию совершенно нормально, поэтому она определенно захватывает ее в функции удаления, я также пытался добавить ее в массив в свойстве features в vectorLayer, но, похоже, не смог заставить это работать или найти какой-либо приличный документация на это.

Я должен отметить, что я настроил кнопки для независимого добавления слоя в данный момент, поэтому я добавлю слой с помощью addLayer, а затем нарисую фигуру с помощью addInteraction, затем попытаюсь удалить указанный рисунок.

    /** This is the input property for the base layer of the map the main source */
@Input('coreMap') coreMap: CoreMapComponent
vectorLayer: VectorLayer;
modifyLayer: Modify;
draw: Draw;
vectorSource: VectorSource;
style: Style;
snap: Snap;
style2: Style;



ngOnInit(){
    this.vectorSource = new VectorSource({
        wrapX: false,
    })

    this.style = new Style({
        fill: new Fill({
            color: '#ffcc33',
        }),
        stroke: new Stroke({
            color: '#ffcc33',
            width: 2
        }),

        image: new CircleStyle({
            radius: 7,
            fill: new Fill({
                color: '#ffcc33'
            })
        })
    })

    this.vectorLayer = new VectorLayer({
        source: this.vectorSource,
        style: [this.style]
    });

    this.modifyLayer = new Modify({ source: this.vectorSource })
}

addLayer(){
    this.coreMap.layerManager.addLayer(this.vectorLayer)
}

getLayers(){
    console.log(this.coreMap.map.getLayers().getArray());
}

removeShape(){
    this.coreMap.map.removeInteraction(this.draw);
    this.coreMap.map.removeInteraction(this.snap);
    this.coreMap.map.on('click', (evt: any) => {
        this.coreMap.map.forEachFeatureAtPixel(evt.pixel,
            (feature: Feature, layer) => {
                this.vectorLayer.getSource().removeFeature(feature)
                return true;
            });
    });
}

addInteraction() {
    this.draw = new Draw({
        source: this.vectorSource,
        style: this.style,
        type: 'Point'
    })
    this.coreMap.map.addInteraction(this.draw)
    this.snap = new Snap({ source: this.vectorSource })
    this.coreMap.map.addInteraction(this.snap);
    this.coreMap.map.addInteraction(this.modifyLayer);
}

1 Ответ

0 голосов
/ 07 января 2019

Замените вашу removeShape() функцию этим! Я уверен, что это будет работать

removeShape(){
    var self = this;
    this.coreMap.map.removeInteraction(this.draw);
    this.coreMap.map.removeInteraction(this.snap);
    this.coreMap.map.on('click', (evt: any) => {
        self.coreMap.map.forEachFeatureAtPixel(evt.pixel,
            (feature: Feature, layer) => {
                self.vectorLayer.getSource().removeFeature(feature)
                return true;
            });
    });
}
...