[Fixed] Updating deck.gl layers in Angular2+

Issue

I am trying to update a deck.gl layer in Angular based on data passed as argument, but it’s not working, the layer does not change. Is updateTriggers just a ‘React only’ feature? If not, what am I doing wrong? Can anyone help me out?

updateLayer(minTime: number, maxTime: number): void {
    const layer = new ArcLayer({
      id: 'arcs',
      data: COORDINATES,
      dataTransform: d => d.filter(f => f.time >= minTime && f.time <= maxTime),
      ...
      updateTriggers: {
        dataTransform: [minTime, maxTime]
      }
    });

    this.deck.setProps({ layers: layer });
}

Any help is appreciated :))

Solution

I think a good approach would be using DataFilterExtension, check this out.

Your COORDINATES contains also time info right? Then you can apply something like:

updateLayer(minTime: number, maxTime: number): void {
  const layer = new ArcLayer({
    id: 'arcs',
    data: COORDINATES,
    filterRange: [1, 1],
    getFilterValue: f => Number(f.time >= minTime && f.time <= maxTime),
    extensions: [new deck.DataFilterExtension({ filterSize: 1 })],
    updateTriggers: {
      getFilterValue: [minTime, maxTime]
    }
  });

  this.deck.setProps({ layers: layer });
}

You can check a full example here using the Scripting API.