如何直接將圖像繪製到ImageData數組 - HTML5/Javascript

我的問題：
我正在製作HTML5遊戲，並試圖通過一次繪製背景而不是每隔一幀重新繪製一次，以使其更快。
爲此，我在畫布上繪製了背景，然後嘗試從中獲取ImageData。不幸的是，我被一個安全錯誤攔截了。無法執行操作，因爲圖像來自外部來源。
我研究過這個，看起來這是一個「功能」，阻止壞人從用戶的硬盤中竊取內容。雖然我加載的這些圖像不是來自硬盤驅動器。

我真的很想加快我的比賽。有沒有解決方案來解決安全錯誤，或者甚至可以直接將圖像加載到圖像數據中，以便通過循環像素來繪製圖像？

（注：我不希望有多個畫布來完成這項工作的混亂）

謝謝，甘如何直接將圖像繪製到ImageData數組 - HTML5/Javascript

來源

2012-02-16 Gan

周圍有沒有辦法，但你可以從另一個域使用的繪製圖像getImageData在這種情況下總會引發安全錯誤。這是爲了防止竊取敏感信息，因爲網站可以生成包含基於cookie或IP地址的私人用戶信息的動態圖像。但是，您可以簡單地使用服務器端腳本來代理映像。

但老實說getImageData和putImageData是相當慢，我不明白這會如何加快你的遊戲。在我看來，你認爲繪製圖像數據比簡單地使用drawImage，它的而不是更快。

如果您希望動畫看起來不錯，那麼您將不得不重繪所有內容，這就是動畫的工作方式。

來源

2012-02-16 05:43:43 Delta

我明白了。嗯。我只是在想，繪製704個單獨的44x44圖像會比繪製單個968x748圖像數據慢。我不知道。你能想出其他提高效率的方法嗎？ – Gan 2012-02-16 06:09:53

哦，在這種情況下，我建議你做服務器端腳本來代理圖像，而不是使用getImageData，如果你只是使用canvas.toDataURL來創建一個Image對象並用drawImage繪製它，那會更好。 – Delta 2012-02-16 06:18:29

會有辦法將圖像數據轉換爲圖像嗎？ – Gan 2012-02-16 06:30:46

如何直接將圖像繪製到ImageData數組 - HTML5/Javascript

回答

相關問題