Jpeg, PNG, GIF -> pixel data array. Как на клиенте получить массив из изображения?

Question

[barkalov]

Здравствуйте!

Подскажите, каким образом можно декодировать Jpeg, PNG и GIF в массив цветов?

А каким образом загрузить изображение в браузер не по URL, а с клиентской машины, через File Open Dialog. Без flash и без сервера.



На поддержку каких браузеров рассчитывать?



Буду признателен за любую информацию.

Answer 1

[Павел Тысляцкий]

Ставим input type=«file», через который получаем путь к файлу (или можно глянуть в сторону fileapi).
Используя canvas можно загрузить изображение, получить высоту и шырину и получить цвет конкретного пикселя через context.getImageData (см. stackoverflow.com/questions/6735470/get-pixel-color-from-canvas-on-mouseover).

Answer 2

[KoXGen]

Попробуйте: http://raphaeljs.com/

Answer 3

[melo]

Как вариант: http://paperjs.org/.
Вот пример с drag & drop: http://paperjs.org/examples/q-bertify/. Авторы пишут, что работает в Webkit, Firefox, Chrome и IE 10.

Comments

[Сергей Протько]

Так же оно работает в Opera 12.10

[barkalov]

Очень интересная библиотека, впечатлён примерами!
Но в моём случае это overkill. Ведь мне даже рисовать ничего не нужно, только распарсить изображение в массив.
Буду использовать невидимый canvas.
Спасибо всем!