canvas - getImageData проверка смены пикселя
 

Вопрос такой. Как можно проверить изменение цвета пикселя в canvas?
Прочитал про getlmageData, если сделать два объекта, в один положить текущие пиксели, а в другой - обновленные. Если их каждый раз проверять if-ом на различие с первоначальными, то это будет огромная затрата ресурсов.
Может хитрость есть какая-то?

if будет ровно 1. Я все равно не понял что вы там делаете, надо ли шерстить пиксельный массив, но если надо то в цикле у вас просто сложение с результатом

var res = false;

for// по пикселам 2-х картинок
res |= (color1-color2); // хотя бы 1 раз будет не 0 и res станет true навсегда

Если только визуально проверять, то подберите подходящий режим композинга. Их там дофига, я уже забыл какой бы подошел. ТО есть рисуете картинку 2 поверх картинки 1 в заданном режиме и всю разницу увидите глазами.

В терминах Фотошопа это режим difference. Так и называется.

Не совсем то, что надо. Мне необходимо найти, какие пиксели поменяли цвет с белого на черный, и соответственно их номера. Именно поэтому я и говорю, что циклом каждый раз проходить динамически перерисовывающийся холст 1000*800px очень затратно.

То есть нужна функция, которая определит, какой пиксель поменял цвет и выдаст его координаты/номер без разницы. Это надо сделать без постоянной перепроверки массива пикселей циклом. Есть какие-нибудь идеи?

Может можно как-то прикрутить самодельный onchange к объекту
context.getImageData.data ?
Но не сравнивая его с первоначальным объектом.

UPD. Почитал про то, что можно писать свои события на jQuery.
Тогда опять же вопрос, это будет DOM объектом или нет?

Не совсем то что было надо с самого начала. И продолжаете скрывать свои цели. КОлитесь, чем правдивее показания - тем больше вариантов нахождения решения. Может оно вовсе и не так делается как вы придумали.

Вы же свое решение предлагаете реализовать. А их думаете 1?

Я достаточно доходчиво объяснил: То есть нужна функция, которая определит, какой пиксель поменял цвет и выдаст его координаты/номер без разницы. Это надо сделать без постоянной перепроверки массива пикселей циклом.
Цели? Ну цели разные могут быть. Например, есть функция для простого рисования, с mouseMove естественно. Так вот, необходимо узнавать координаты пикселей, которые пользователь закрасил.

Это неколебимо - не колятся. Упрутся в свою придумку и долбят форумы. И что вы с этими координатами делаете? (в порядке национальной традиции вести дискуссию в формате допроса). Выделять? Добавьте слой.

Канвасные процедуры выполняются на клиенте. То есть теоретически вы можете написать свой веб-фотошоп. Потому что в ФШ по щелчку на канале загружается беготня мураьев по thereshold 50% за секунду на нормальном таком пикселяже.

Уж извините, то что я буду делать с координатами это мое сугубо личное дело. Я спросил две вещи, как это можно сделать и является ли getImageData DOM элементом. Если не можете ответить, просьба не флудить в данном топике, ибо "Упрутся в свою придумку и долбят форумы" и "То есть теоретически вы можете написать свой веб-фотошоп. "
это чистейший флуд.

В ФШ рендер сделан вот так: у него же картинка может быть опупенной, а юзер ее может уменьшить - но не саму, а экранный кэш. Так вот экранный кэш сегментируется и рендерится не весь канвас (в ФШ тоже такой термин) а тот сегмент, который затронули изменения. А изменения отождествляются именно по кешу. То есть юзер махнул кистью - ФШ нарисовал ее след в кеше, в сегменте кеша. А пока юзер любуется - ФШ перетаскивает все в свой срач-диск, ну где лежат собственно пикселы. Не знаю пригодится ли.

Извиняю, делайте свое личное дело, в смысле попробуйте природу на...ть.

Хорошо. Спасибо.
Вопрос открытым остается, является ли объект context.getImageData.data
элементом DOM?

А как ты думаешь он из форточки залетел или его взяли из объектной модели документа?

Ну раз холст находится на странице, то объект получает информацию о пикселях тоже из документа, следовательно DOM. Так?

levshkatov,
Нет, это массив.

То есть прикрутить к нему свое событие с помощью jQuery не получится?

levshkatov,
нет. Но попробуй воспользоваться графическими библиотеками, наверняка там реализован подобный функционал.

Можете поподробнее рассказать про графические библиотеки. Я просто первый раз с этим встречаюсь.

Как вариант посмотри http://paperjs.org/, а вообще тысячи их

Спасибо, посмотрю!