最新的Web開發教程
 

HTML canvas scale() Method

<畫布對象

例

繪製一個矩形，規模為200％，然後再繪製矩形：

YourbrowserdoesnotsupporttheHTML5canvastag。

JavaScript的：

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
試一試»

瀏覽器支持

在表中的數字規定，完全支持方法的第一個瀏覽器版本。

方法
scale() 4 9 3.6 4 10.1

定義和用法

的scale()方法縮放當前圖形，更大或更小。

Note:如果您縮放繪圖，未來所有的圖紙也將被縮小。 定位也將縮小。 如果您scale(2,2) ; 圖紙都需要進行兩次從畫布的左側和頂部，只要您指定的位置。

JavaScript語法： context 。 scale( scalewidth,scaleheight ) ;

參數值

參數 描述 播放
scalewidth 縮放當前圖形的寬度(1=100%, 0.5=50%, 2=200%, etc.) 播放 ”
scaleheight 縮放當前圖形的高度(1=100%, 0.5=50%, 2=200%, etc.) 播放 ”
例子

更多示例

例

繪製一個矩形，規模為200％，再次繪製矩形，規模為200％，再次繪製矩形，規模為200％，再次提請矩形：

YourbrowserdoesnotsupporttheHTMLcanvastag。

JavaScript的：

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
試一試»
<畫布對象