我有一张图像（9600x7200），我在启用Google地图的网页上用作叠加层。我使用latlng锚定SW和NW角，当我缩放地图时图像可以正确缩放。现在我想创建第二个叠加层，它是一个HTML5画布元素，大小也是9600x7200，位于图像的顶部。我可以这样做，但是当我在画布上画画时，缩放/定位都是错误的。我使用https://developers.google.com/maps/documentation/javascript/examples/overlay-simple作为两个叠加层的模板，它将叠加元素设置为父div的100％，这是锚定到地图的内容。这适用于<img>，但不适用于HTML5画布，它没有像图像那样的固有大小。 （您可以在CSS中设置宽度/高度，但底层图像具有真实尺寸，然后缩放到CSS尺寸）。
所以，我的问题是：如何创建一个9600x7200的可绘制画布大小，并将其锚定到我的地图，使其位置和比例与其下方的<img>叠加层相匹配？是否有任何代码示例？
答案 0 :(得分：0)
不要使用CSS调整画布大小，通过canvas元素的width和height属性设置它。如果你在画布上画画（为了简单起见，让它说它的拉伸到正常尺寸的两倍），它的尺寸和位置也会被拉伸。因此，如果您尝试在x：10，y：10处更改像素的颜色，则会在x：20，y：20处获得2x2（近似）的正方形。