HTML canvas scale() 方法
实例
画一个矩形，缩放到200%，然后再画矩形:
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.0 | 9.0 | 3.6 | 4.0 | 10.1 |
定义和用法
scale() 方法缩放当前绘图，放大或缩小。
注释: 如果您缩放绘图，所有未来的绘图也将被缩放。 定位也将被缩放。 如果你缩放（2,2）； 绘图的位置将是您指定的距画布左侧和顶部的两倍。
| JavaScript 语法: | context.scale(scalewidth, scaleheight); |
|---|
参数值
| 参数 | 描述 | Play it |
|---|---|---|
| scalewidth | 缩放当前绘图的宽度（1=100%、0.5=50%、2=200% 等） | Play it » |
| scaleheight | 缩放当前绘图的高度（1=100%、0.5=50%、2=200% 等） | Play it » |
更多实例
实例
画一个矩形，缩放到200%，再画矩形，缩放到200%，再画矩形，缩放到200%，再画矩形:
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);
亲自试一试 »
❮ Canvas 对象
