武林網(www.vevb.com)文章簡介:HTML5每日一練之Canvas標籤的應用-繪製坐標變換圖形.
繪製圖形的時候,我們可能經常會想到旋轉圖形,或者對圖形使用變形處理,使用Canvas API的坐標軸變換處理功能,就能實現這種效果。在計算機上繪製圖形的時候,是以坐標點為基準來進行繪製的,默認情況下Canvas畫布的最左上角對應於坐標軸的原點(0, 0)。前面我們所講的所有利用Canvas API繪製出來的圖形都是以畫布最左上交為坐標軸圓點,並以像素為單位來進行繪製的。
如果對這個坐標軸進行改變,那麼就可以實現圖形的變換處理了。對坐標的變換處理有以下三種方式:
平移
使用圖形上下文對象的translate方法移動坐標軸原點,該方法定義如下: