React-map-gl: Add Image for Layer

[AndriusCvetkovas]

Is it possible to add custom pin image for the cluster layer? This is what I tried and no luck

const image = new Image(50, 50);
image.src = './myPin.svg';
const images = ["myPin", image];
...
<Layer {...unclusteredPointLayer} images={images} layout={{ 'icon-image': 'myPin'}} />

[AndriusCvetkovas]

Found a solution.
onLoad={() => {
if (!this.map) return
const map = this.map.getMap()
map.loadImage('./myPin.svg' , (error, image) => {
if (error) return
map.addImage('myPin', image)
})
} }
>

[remjx]

Using a functional component & hooks, I'm doing it like this:

const _mapRef = createRef();
useEffect(() => {
    const map = _mapRef.current.getMap();
    map.loadImage('/map-pin.png', (error, image) => {
        if (error) throw error;
        if (!map.hasImage('map-pin')) map.addImage('map-pin', image, { sdf: true });
    });
}, [_mapRef]);
return (
    <ReactMapGL
        ref={_mapRef}
    >
);