Actualmente estoy tratando de superponer una imagen en Google Maps. Por mucho, logré colocar esa imagen en los mapas de Google, pero no estaba en la posición correcta.
Tengo coordenadas (lat-longs) de la imagen donde quiero que se superponga en el mapa.
Traté de colocarlo usando la metodología de Google Map Tiles. Para que se muestre como mosaico, lo nombré "image_name_zoom_x_y.png" . Entonces, cuando selecciona un nivel de zoom específico (utilicé 18), la imagen se muestra en un mosaico pero se muestra en una ubicación incorrecta (mosaico).
¿Cómo hacer coincidir las coordenadas x , y del mosaico con la latitud y longitud de la imagen para poder colocar la imagen en la ubicación correcta?
Aquí es donde llegué hasta ahora:
const TILE_URL = 'xyz.com/orthoImage_{z}_{x}_{y}.png'; const imageMapType = new google.maps.ImageMapType({ getTileUrl: function (coord, zoom) { console.log(coord); const url = TILE_URL .replace('{z}', zoom) .replace('{x}', coord.x) .replace('{y}', coord.y); console.log('url', url); return url; }, tileSize: new google.maps.Size(256, 256), minZoom: 1, maxZoom: 20 });Creo que deberías mirar esto, esto es algo que probablemente necesites.
https://developers.google.com/maps/documentation/javascript/groundoverlays#introduction