Offset custom marker in a static map
greenafrican opened this issue · 0 comments
greenafrican commented
It would be great if we could provide an offset for the custom markers. Something like:
client.getStaticImage({
...
overlays: {
coordinates: [18, -33],
url: "../../customPin.png",
offset: [0.5, 1]
}
This would help when we use a custom pin or flag or something where the bottom-centre point should mark the location.
As a workaround, I currently use this to offset the latitude coordinate:
// From https://stackoverflow.com/a/30773300/1177562
const metersPerPixel = (latitude: number, zoomLevel: number) => {
const earthCircumference = 40075017
const latitudeRadians = latitude * (Math.PI / 180)
return (earthCircumference * Math.cos(latitudeRadians)) / Math.pow(2, zoomLevel + 9)
}
export const getLatitudeDegreesOffset = (latitude: number, pixels: number, zoomLevel: number) => {
// https://gis.stackexchange.com/questions/2951/algorithm-for-offsetting-a-latitude-longitude-by-some-amount-of-meters
return (metersPerPixel(latitude, zoomLevel) * pixels) / 111111
}