无法在 google 个地图上叠加图像

Question

我目前正在尝试在 google 地图上叠加图像。到目前为止，我已成功在 google 地图上找到该图片，但它的位置不正确。

我有图像的坐标（经纬度），我希望它覆盖在地图上。

我尝试使用 google 地图图块方法放置它。为了将其显示为图块，我将其命名为 "image_name_zoom_x_y.png"。因此，当您 select 特定的缩放级别（我使用 18 ）时，图像显示在图块上，但显示在错误的位置（图块）。

如何将图块的 x、y 坐标与图像的经纬度相匹配，以便我能够将图像放置在正确的位置？

这是我到目前为止的进展：

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
});

Answer 1

我想你应该看看这个，这是你可能需要的东西

https://developers.google.com/maps/documentation/javascript/groundoverlays#introduction

无法在 google 个地图上叠加图像

Unable to overlay an image on google maps

javascript

reactjs

google-maps

google-maps-api-3