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

Question

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

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

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

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

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

Спасибо,

DLiKS

Edit: Вот код, я использую, чтобы сделать изображение Google Maps на холсте:

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

Прочитав статью, я думаю, что вы неправильно, что Mr.doob сказал:

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

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

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

Answer 2

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

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

Answer 3

Присвоить src к изображению, используя одну страницу ASPX, и что страницы ASPX ответит с текстом на изображение.

Например:

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