Нарисуйте изображение из массивов данных пикселей

Question

Если у меня есть массив данных пикселей в JavaScript, есть ли хороший способ отобразить его на странице HTML?

• В последних версиях Safari и Firefox я могу создать элемент <canvas> и использовать putImageData для отображения пикселей, но в идеале решение может работать и на более старых версиях, и, что более важно, работать в Internet Explorer.
• Другое решение, которое кажется более осязаемым, может состоять в том, чтобы закодировать пиксели в стандартный формат изображения и создать URI data: с пикселями и установить его как src элемента <img>. К сожалению, кажется, что большинство форматов изображений являются сложными, и мне трудно найти простой, который может выполнить эту работу (BMP выглядит как возможность, но не работает в Safari). Кроме того, версии Internet Explorer до IE 8 вообще не поддерживают data: URI.

Я сомневаюсь, что они существуют, но кто-нибудь знает библиотеки изображений для JavaScript, которые могут генерировать изображения в стандартном формате? Есть ли способ реплицировать функциональность data: URI в IE 7?

Answer 1

Canvas - хорошее решение, для поддержки кросс-браузерной работы см. Превосходное руководство Марка Пилигрима:

http://diveintohtml5.ep.io/canvas.html В частности, «А как насчет IE?»раздел и использование explorercanvas.Вы можете использовать и создавать данные: URI в форматах png и jpeg с canvas.

Answer 2

Работает ли формат PNG для ваших целей?Если так, то PNGlib выглядит довольно хорошо.

Кроме того, JS JPEG Encoder выглядит хорошо, но принимает в качестве входных данных возвращаемое значение Canvas.getImageData ().

Не знаю, что вы можете сделать для поддержки IE 7.

Answer 3

Может быть, проверьте fxCanvas http://burzak.com/pro/fxcanvas/

Я думаю, что они реализуют даже "putImageData" в IE, используя Flash.

Answer 4

Check your Raphaël - http://raphaeljs.com/

Несмотря на то, что это может быть медленным, и использование библиотеки не по назначению, она будет работать с поддержкой интересующих вас браузеров.