Отображение изображений на холсте html5 из двоичных данных

Я пытаюсь отправить изображение с холста через API-интерфейс движка приложения Google другому клиенту, который затем отобразит то же изображение. Сообщение принимается, но изображение не отображается.

На стороне отправки:

var image = context.getImageData(0, 0, imageCanvas.width, imageCanvas.height);
var buffer = new ArrayBuffer(image.data.length);
var bytes = new Uint8Array(buffer);
for (var i=0; i<bytes.length; i++) {
    bytes[i] = image.data[i];
}

sendMessage({image: buffer});

Отображение данных на другом конце:

var bytes = new Uint8Array(buffer.size);
var image = context.createImageData(imageCanvas.width, imageCanvas.height);
for (var i=0; i<image.length; i++) {
    image.data[i] = bytes[i];
}
context.drawImage(image, 0, 0);

Консоль постоянно сообщает, что в последней строке есть Ошибка ввода.


person Alec Hewitt    schedule 26.07.2013    source источник


Ответы (1)


поменять местами drawImage с putImageData

createImageData() возвращает объект ImageData.

http://tinker.io/e3ec8

у вас также есть ошибка здесь: for (var i=0; i<image.length; i++) {
вы хотите, чтобы image.data.length не длина изображения

person rlemon    schedule 26.07.2013
comment
Спасибо за ваш ответ. Я больше не получаю ошибку типа. Однако изображение все еще не рисуется на холсте. - person Alec Hewitt; 26.07.2013
comment
спасибо, но я думаю, что должна быть еще одна ошибка, и она все еще не работает... - person Alec Hewitt; 26.07.2013
comment
@AlecHewitt хорошо, если бы вы могли написать новый вопрос, и мы могли бы поработать над этим вопросом отдельно (подсказка: это не имеет ничего общего с кодом, который у вас есть здесь). см.: tinker.io/e3ec8/1 - person rlemon; 26.07.2013
comment
спасибо за помощь в этом вопросе. С тех пор я применил несколько иной подход, используя метод toDataURL(). Преимущество этого заключается в том, что он работает между холстами на одной странице, но создает «InvalidMessageError», когда я пытаюсь отправить его на сервер. Как вы предложили, я создал новый вопрос, который можно увидеть здесь: stackoverflow.com/questions/17958052/ - person Alec Hewitt; 31.07.2013