轉換帆布，其利用的drawImage方法的至PNG

Question

我有兩個按鈕，一個按鈕用於創建與圖像的畫布。其他按鈕將畫布轉換爲PNG數據（至少，這就是我想要實現的）。

問題是，JavaScript以某種方式不會將畫布轉換爲圖像數據。

檢查的jsfiddle這裏：http://jsfiddle.net/julekker/tjYzw/1/

我試着使用window.location = finalcanvas.toDataURL("image/png");和

var img = finalcanvas.toDataURL("image/png"); 
document.write('<img src="'+img+'"/>'); 

但他們都沒有工作。

你怎麼能轉換的畫布圖像，這使得使用的drawImage方法PNG數據？

Answer 1

在jsfiddle代碼中，您似乎將一個外部圖像繪製到畫布上。如果出於安全原因它是跨域訪問，那麼將阻止訪問像素數據和toDataURL。

這個問題已經在這裏被覆蓋了很多次;有關使用CORS解決此問題和瀏覽器支持的討論，請參閱Browser Canvas CORS Support for Cross Domain Loaded Image Manipulation。另一個選項可能是通過本地代理加載圖像。