пример
Нарисуйте прямоугольник, масштаб до 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() метод масштабирует текущий чертеж, больше или меньше.
Note: Если масштабировать рисунок, все будущие рисунки также будут уменьшены. Позиционирования будет также масштабировать. Если scale(2,2) ; чертежи будут располагаться вдвое дальше от левой и верхней части холста, как вы укажете.
Синтаксис JavaScript: | context . scale( scalewidth,scaleheight ) ; |
---|
Значения параметров
параметр | Описание | Сыграй |
---|---|---|
scalewidth | Весы ширину текущего чертежа (1=100%, 0.5=50%, 2=200%, etc.) и (1=100%, 0.5=50%, 2=200%, etc.) | Сыграй " |
scaleheight | Весы высоту текущего чертежа (1=100%, 0.5=50%, 2=200%, etc.) и (1=100%, 0.5=50%, 2=200%, etc.) | Сыграй " |
Еще примеры
пример
Нарисуйте прямоугольник, масштаб до 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);
Попробуй сам " <Холст объекта