В настоящее время у меня есть холст, на котором пользователи могут рисовать, который расположен над другим элементом холста с отображенным на нем изображением. Когда пользователь dr aws на холсте, данные вновь нарисованной метки сравниваются с соответствующими данными пикселя на изображении. Если значения rgba находятся в пределах определенного порога, пиксель холста изменяется на непрозрачный, в противном случае он удаляется. Цель состоит в том, чтобы выделить только определенные части холста, чтобы выделить только определенные c пикселей в пределах порога изображения. Тем не менее, я не могу получить отметки рисования на наклеить на холст, так сказать. Данные холста обновляются, а затем устанавливаются, что должно сохранить изменения. Я не совсем уверен, что я делаю неправильно. Вот мое демо:
https://codesandbox.io/s/small-star-sqrjv
Сравнение происходит в функции с именем highlightImagePixels, расположенной в нижней части файла JavaScript.
Я также пытаюсь избежать задержки и замедления при загрузке всего массива данных пикселей. Цель состоит в том, чтобы выбрать только те пиксельные данные, которые были нарисованы.