Что это значит и как это помогает?

Question

В данный момент я пишу веб-приложение, которое импортирует данные изображений из Карт Google через Статический API - http://code.google.com/apis/maps/documentation/staticmaps/ - в холст HTML5.

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

Тем не менее, я читал эту запись в блоге мистера Дуба, одного из людей, стоящих за видео в Центре дикой природы (http://thewildernessdowntown.com), в котором используется холст с Google Maps - http://mrdoob.com/blog/post/705 - и это читает:

"Дополнительная проблема заключалась в том, что у вас нет доступа к пиксельным данным изображений, загруженных из другого домена ... Однако, хотя пиксельный доступ запрещен, context.drawImage () разрешен для копирования областей из изображений, размещенных на других доменах. "

Я чувствую, что это может быть решением моей проблемы, так как позже в этом посте показано манипулирование пикселями изображения, но я не совсем понимаю, что именно означает "context.drawImage () разрешено для копирования областей из изображения, размещенные на других доменах, и было бы очень полезно, если бы кто-то смог уточнить это для меня.

Спасибо

DLiKS

Редактировать: вот код, который я использую для рисования изображения Карт Google на холсте:

var ctx = document.getElementById('canvas').getContext('2d'); 
var img = new Image(); 
img.src = 'LINK TO GOOGLE MAPS IMAGE'; 
img.onload = function(){ 
ctx.drawImage(img,0,0); 
}

Изображение отображается ОК, но когда я пытаюсь использовать getImageData для управления этим встроенным изображением на холсте, я получаю ошибку безопасности

Answer 1

Прочитав статью, я думаю, что вы неверно истолковали сказанное Мистером Дубом:

"[Джейми] затем начал исследовать другие способы рисования Картографических данных таким образом, чтобы создать тот же эффект."

Он не манипулирует пикселями , он использует context.drawImage для

"... обрезка столбцов исходного изображения и позиционирование их один за другим по горизонтали."

Answer 2

Назначьте src изображению, используя одну страницу aspx, и эта страница aspx ответит вашим текстом на изображение.

Например:

image.src="CreateImage.aspx";
image.onload = function () {
    ctx.drawImage(image,5,5,width,height);
}

Answer 3

context.drawImage() Я считаю, что это какой-то способ манипулирования HTML 5 Canvas.Посмотрите на эти веб-страницы.

http://dev.opera.com/articles/view/html-5-canvas-the-basics/
http://diveintohtml5.ep.io/canvas.html