目前我正在編寫一個Web應用程序,該應用程序通過Static API - http://code.google.com/apis/maps/documentation/staticmaps/將來自Google Maps的圖像數據導入到HTML5畫布中。這意味着什麼以及它如何提供幫助?
不幸的是,由於跨域限制,我遇到了無法操縱Google Maps中的像素數據的問題。
不過,我一直在讀通過杜布先生鬧市區的荒野視頻(http://thewildernessdowntown.com),它採用了與谷歌地圖的畫布背後的人的一個這篇博客文章 - http://mrdoob.com/blog/post/705 - 它寫着:
「另一個挑戰是,您無法訪問從另一個域加載的圖像的像素數據......但是,雖然禁止像素訪問,但允許使用context.drawImage()從其他域上託管的圖像複製區域。 「
我覺得這可能是解決我的問題稍後在後它顯示的圖像的像素操作,但我不完全得到確切含義由「context.drawImage()被允許從託管在其他域上的圖像複製區域',如果有人能爲我澄清它,這將非常有幫助。
感謝,
DLiKS
編輯:這是我使用谷歌地圖的圖像畫在畫布上的代碼:
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來操縱這個嵌入式圖像在畫布上,我得到一個安全錯誤
有趣的問題,+1。作爲一個附註,請注意Google的地圖是受版權保護的材料,所以您可以合法地對它們做些什麼限制。 – 2010-10-26 14:52:43
'不幸的是,由於跨域限制,我遇到了無法操縱來自Google地圖的像素數據的問題。「您使用什麼代碼? – Harmen 2010-10-26 15:06:22
我已將代碼作爲編輯添加到問題中。 – DLiKS 2010-10-26 15:18:25