Trigger redraw of the BitmapLayer in deck.gl

Question

I have a map as an image that can be accessed over an API on an url. As part of a mapping process this image is constantly being updated while the url is always the same.

To display it in frontend (react) I use the BitmapLayer with the image property set to the desired url. It is correctly rendered on initialization.

The problem I have is how to update the map. I have an event that is triggered when the image is updated on the server. When this event is triggered I update the layers. But the image is not getting updated, which actually makes sense since deck.gl only updates on change and the url did not change... So I tried to fix this problem by using the updateTriggers property like so:

new BitmapLayer({
    id: "bitmap-layer",
    image: image_url,
    updateTriggers: {
        image: [Math.random()]
    }
})

with the idea to update the image when the trigger changes (called when change event is triggered). But the image is not getting updated.

I also tried to change the id of the image layer on each change but the image still did not change.

My question would therefore be, if it is somehow possible to trigger the update of the image without changing the url?

Answer 1

One way to refresh an image at the same url can be adding a unique cache-busting query parameter such as:

image: image_url + "?t=" + new Date().getTime(),