Html5 Canvases具有最大尺寸 - 圖像怎麼樣？

Question

Html畫布的最大尺寸取決於設備/瀏覽器。例如，某些手機最大可能有1000x1000的畫布。內存中存儲的圖像怎麼樣？這些可以達到電話/電腦的內存？您可以在這些自動裁剪的「1000x1000」畫布上繪製大圖像嗎？ （我甚至沒有手機來測試這個特定設備。）

Answer 1

圖像對象的最大尺寸可能是瀏覽器或內存相關的。

更多你的問題...

你畫到畫布上的圖像對象可以比畫布大。

這會導致畫布成爲圖像中的「視口」。

例如：

• 你的畫布是1000×1000。
• 您的圖像是1500x1500。

如果你這樣做，那麼圖像像素將在x> 1000和y> 1000時被裁剪。

// canvas shows image pixels from x=0-999 and y=0-999 

drawImage(yourImage,0,0) 

如果這樣做，那麼圖像的像素將被在x處 X> 1200和y < 200且y> 1200裁剪。

// canvas shows image pixels from x=200-1999 and y=200-1999 

drawImage(yourImage,-200,-200) 

一個腦力鍛鍊，看看它是如何工作的設想與矩形「視」從中切一塊紙。然後在紙張後面移動一個大於視口的圖像。只有部分圖像只能通過視口看到。您可以移動圖像，並在視口中顯示圖像的不同部分。