У меня есть холст с несколькими растровыми изображениями.Я использую onMouseDown
на Tool
, чтобы найти, выберите элемент, по которому щелкнули.
У меня новое требование.
Предположим, два изображения перекрывают друг друга, а верхнее изображение частично прозрачно.Это делает нижнее изображение видимым.Но когда я пытаюсь щелкнуть на нижнем изображении, очевидно, что в итоге я выбираю верхнее изображение.
Неудачная попытка
Я пытался использовать функцию getPixel(point)
наРастр.Я подумал, что если я смогу понять, что выбранный пиксель прозрачен, я могу проигнорировать этот растр и искать другие элементы.Но я не получаю ожидаемое значение цвета (прозрачное или нет) с помощью этой функции.
Итак, моя вторая мысль была о том, что мне нужно изменить точку события mousedown с глобального координатного пространства на локальное растровое координатное пространство.Это все еще не сработало.
Есть ли способ добиться того, чего я хочу?
Код
tool.onMouseDown = (event) => {
project.activeLayer.children.forEach((item) => {
if (item.contains(event.point)) {
// check if hit was on a transparent raster pixel
const pixel = item.getPixel(event.point)
console.error(pixel.toCSS(true))
// 2nd attempt
const pixel = item.getPixel(item.globalToLocal(event.point))
console.error(pixel.toCSS(true))
}
}
}