canvas 父节点设置了缩放比例，导致获取canvas里面的图片位置不对

当父节点设置了缩放比例时，canvas 中的元素会相应地被缩放。因此，如果你获取 canvas 中的图片位置，需要考虑到父节点的缩放比例。

你可以通过 `getBoundingClientRect()` 方法获取 canvas 区域相对于浏览器窗口的位置和大小，然后根据父节点的缩放比例计算出 canvas 中图片的真实位置。

例如，假设你有一个 `canvas` 元素和一个 `div` 父元素，父元素设置了缩放比例为 `0.5`，你想要获取 canvas 中某个图片元素的位置，你可以这样做：

const canvas = document.querySelector('canvas');
const img = document.querySelector('img');

// 获取 canvas 相对于浏览器窗口的位置和大小
const canvasRect = canvas.getBoundingClientRect();

// 计算父元素缩放后的大小
const parentScale = window.getComputedStyle(canvas.parentNode).getPropertyValue('transform').match(/^matrix\((.+)\)$/)[1].split(',').map(parseFloat)[0];

// 计算图片在 canvas 中的位置
const imgX = (img.offsetLeft - canvasRect.left) / parentScale;
const imgY = (img.offsetTop - canvasRect.top) / parentScale;

console.log(`Image position in canvas: (${imgX}, ${imgY})`);

上述代码中，我们首先获取了 canvas 相对于浏览器窗口的位置和大小，然后通过 `window.getComputedStyle()` 方法获取了父元素的缩放比例，并计算出了图片在 canvas 中的真实位置。