这意味着什么以及它如何帮助?

DLi*_*iKS 6 javascript html5 canvas

目前,我正在编写一个Web应用程序,该应用程序通过静态API(http://code.google.com/apis/maps/documentation/staticmaps/)将图像数据从Google地图导入到HTML5画布中.

不幸的是,由于跨域限制,我遇到了无法操纵Google地图中的像素数据的问题.

但是,我一直在阅读Doob先生的博客文章,他是Wilderness Downtown视频背后的人之一(http://thewildernessdowntown.com),该视频采用了Google地图的画布 - http://mrdoob.com/blog/发表/ 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); 
}
Run Code Online (Sandbox Code Playgroud)

图像显示OK,但是当我尝试使用getImageData在画布上操作此嵌入图像时,出现安全错误

gbl*_*zex 3

读完这篇文章后,我认为您误解了杜布先生所说的话:

“[Jamie] 然后开始研究其他绘制地图数据的方法,以产生相同的效果。”

不进行像素操作,他context.drawImage用于

“......从原始图像中裁剪列并将它们水平放置在一个接一个的位置。”

  • 这怎么可能……真的!我正要给出完全相同的答案,但你在令人难以置信的 13 秒内击败了我! (3认同)