Programmatically change OFFSET of MapBox Marker via JavaScript

0
votes

Following on from this question I asked yesterday...

I am adding MapBox Markers to an array like so:

var el = document.createElement('div' + index);
el.className = 'marker';
deviceMarkers.push(new mapboxgl.Marker(el, { offset: [-50 / 2, -50 / 2] }).setLngLat([device.lat, device.lon]).addTo(map));

Elsewhere in the code, I extract the marker via:

var deviceMarker = deviceMarkers[index];

I now need to be able to change the offset of deviceMarker programmatically in javascript, to ensure that the image is still centred as the div resizes with zoom.

Can it be done, and if so, how?

1
javascriptmapboxmapbox-gl-js
What do you mean by "marker offset"? AFAIK there is no thing called "offset" associated with marker other then the z-index offset – xmojmr
It's in the first code block, mate: { offset: [-50 / 2, -50 / 2] } I want to be able to change this dynamically. It's a positional offset so that the image being used for the marker is centred. Obviously this has to change as the image size changes. – HomerPlata
There is no way to do this with the current API. I would recommend you just make a new marker with the new offset and the existing element (i.e. new mapboxgl.Marker(oldMarker.getElement(), ... and then remove the old marker) – mollymerp
Thanks @mollymerp. Your help is much appreciated again. – HomerPlata
Can you add that as an answer @mollymerp and I will accept it. Tar. – HomerPlata

1 Answers

1
votes

There is no way to do this with the current API. I would recommend you just make a new marker with the new offset and the existing element (i.e. new mapboxgl.Marker(oldMarker.getElement(), ...) and then remove the old marker)