Essentially, I want to set the center of the map to some coordinates x, y where there is a Marker. Then move the center of the map up by some value of pixels on the screen so that the marker appears slightly below the center of the map.
My initial thought was to just do something like this to offset the viewport (adding 0.0009 to the latitude value):
setViewport({
...viewport,
longitude: x,
latitude: y + 0.0009,
})
However, this is when I realized that 0.0009° away from the Marker will look a lot more off center to a user who is very zoomed-in and be completely unnoticeable to user who is very zoomed-out (not to mention I'm not sure if this method will work for Markers south of the equator). Yes this makes perfect sense, but for some reason I didn't think of it when trying this out.
So my question is, is there some parameter I can add that will allow me to provide the location of the Marker at x, y and then also provide an offset value that would move the center of the viewport 50 pixels up from the x, y value provided? This way the distance from x, y to the center of the viewport would always appear the same, regardless of zoom.
setViewport({
...viewport,
longitude: x,
latitude: y,
offsetTop: 50
})
