Javascript 这意味着什么?它有什么帮助?
目前,我正在编写一个web应用程序,通过静态API将图像数据从谷歌地图导入HTML5画布 不幸的是,由于跨域限制,我遇到了无法从谷歌地图操作像素数据的问题 然而,我一直在读Doob先生的这篇博文,Doob先生是荒野商业区视频()的幕后人员之一,该视频使用canvas和谷歌地图,内容如下: “另一个挑战是,您无法访问从另一个域加载的图像的像素数据……但是,尽管禁止像素访问,但允许context.drawImage()从其他域承载的图像复制区域。” 我觉得这可能是我问题的解决方案,因为在后面的文章中,它显示了图像的像素操作,但我不太明白“context.drawImage()允许从其他域托管的图像复制区域”的确切含义,如果有人能为我澄清这一点,那将非常有帮助 谢谢 德利克斯 编辑:下面是我用来将谷歌地图图像绘制到画布上的代码:Javascript 这意味着什么?它有什么帮助?,javascript,html,canvas,Javascript,Html,Canvas,目前,我正在编写一个web应用程序,通过静态API将图像数据从谷歌地图导入HTML5画布 不幸的是,由于跨域限制,我遇到了无法从谷歌地图操作像素数据的问题 然而,我一直在读Doob先生的这篇博文,Doob先生是荒野商业区视频()的幕后人员之一,该视频使用canvas和谷歌地图,内容如下: “另一个挑战是,您无法访问从另一个域加载的图像的像素数据……但是,尽管禁止像素访问,但允许context.drawImage()从其他域承载的图像复制区域。” 我觉得这可能是我问题的解决方案,因为在后面的文章
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在画布上操作此嵌入图像时,出现了安全错误。drawImage()我认为这是操作HTML 5画布的某种方法。
看看这些网页
读了这篇文章后,我认为你误解了杜布先生的话: “[Jamie]然后开始研究绘制地图数据的其他方法,以产生相同的效果。” 他不做任何像素操作,他使用上下文.drawImage “..从原始图像中裁剪列,然后将它们一个接一个地水平定位。”
使用一个aspx页面将
src
分配给图像,该aspx页面将用您的文本响应图像
例如:
image.src="CreateImage.aspx";
image.onload = function () {
ctx.drawImage(image,5,5,width,height);
}
有趣的问题,+1。作为旁注,请注意谷歌的地图是受版权保护的材料,因此您可以合法使用这些地图有一定的限制。
不幸的是,由于跨域限制,我遇到了无法操作谷歌地图像素数据的问题。
您使用什么代码?我已将代码作为编辑添加到问题中。问题很好,我也不明白。我试图将图像数据从一个画布元素复制到另一个画布元素,但操纵第二个画布也会出现安全错误。嘿嘿。我发布了一个几乎完全相同的答案。现在没有意义了,所以我将把我的权重添加到你的上下文中(因为当天的投票数已经用完了,所以不能+1)。drawImage()只是将图像放置到画布上的标准方法。然而,仅仅在链接的示例中使用它不允许对远程图像进行基于像素的图像处理(这正是我试图实现的)。我想弄清楚的是,杜布先生是如何通过巧妙地操纵这个函数来绕过这个限制的。谢谢你的回答!事实上,这并不是问题的答案。我试图使用drawImage
,但它给出了一个异常:SECURITY\u ERR:DOM异常18
这怎么可能。。。真正地我正要给出完全相同的答案,但你在难以置信的13秒内打败了我!啊,我明白了!谢谢你的回答!