Параметры

Синтаксис

Метод addColorStop

Пример

Синтаксис

ShadowOffsetY

Пример

Синтаксис

ShadowOffsetX

Пример

Синтаксис

ShadowColor

Пример

Синтаксис

ShadowBlur

Пример

Параметры

Синтаксис

Метод fillRect

Заливает прямоугольную область цветом, определенный свойством fillStyle.

fillRect(x,y,width,height)

·x и y — координаты левого верхнего угла прямоугольника;

·width — ширина прямоугольника;

·height — высота прямоугольника.

Все параметры обязательны, должны быть положительными числами.

Javascript

ctx.fillRect(50,50,100,50);

ctx.strokeRect(120,100,100,50);

ctx.clearRect(100,70,50,50);

Задает размер размытия тени.

shadowBlur [= value]

Значение по умолчанию равно 0.

Javascript

var canvas = document.getElementById("myCanvas");

var ctx = canvas.getContext("2d");

ctx.shadowOffsetX = 4;

ctx.shadowOffsetY = 4;

ctx.shadowBlur = 4;

ctx.shadowColor = "rgba(0, 0, 0, 0.5)";

ctx.fillStyle = "red";

ctx.fillRect(50,50,200,100);

Задает цвет тени.

shadowColor [= value]

Значением может быть имя цвета, шестнадцатеричный код, rba/rgba представление.

Javascript

var canvas = document.getElementById("myCanvas");

var ctx = canvas.getContext("2d");

ctx.shadowOffsetX = 4;

ctx.shadowOffsetY = 4;

ctx.shadowBlur = 4;

ctx.shadowColor = "rgba(0, 0, 0, 0.5)";

ctx.fillStyle = "red";

ctx.fillRect(50,50,200,100);

Подготовил: Евгений Рыжков Дата публикации: 14.10.2011

Задает смещение тени относительно объекта по оси X в пикселах.

shadowOffsetX [= value]

По умолчанию смещение равно 0. Положительные значения смещают тень вправо, отрицательные — влево.

Javascript

	var canvas = document.getElementById("myCanvas");
	var ctx = canvas.getContext("2d");
	ctx.shadowOffsetX = 4;
	ctx.shadowOffsetY = 4;
	ctx.shadowBlur = 4;
	ctx.shadowColor = "rgba(0, 0, 0, 0.5)";
	ctx.fillStyle = "red";
	ctx.fillRect(50,50,200,100);

Задает смещение тени относительно объекта по оси Y в пикселах.

shadowOffsetY [= value]

По умолчанию смещение равно 0. Положительные значения смещают тень вниз, отрицательные — вверх.

Javascript

var canvas = document.getElementById("myCanvas");

var ctx = canvas.getContext("2d");

ctx.shadowOffsetX = 4;

ctx.shadowOffsetY = 4;

ctx.shadowBlur = 4;

ctx.shadowColor = "rgba(0, 0, 0, 0.5)";

ctx.fillStyle = "red";

ctx.fillRect(50,50,200,100);

Добавляет стоп цвет объекту градиента, созданному методом createLinearGradient или createRadialGradient.

addColorStop(position, color)

·position — положение цвета в градиенте. Значение должно быть в диапазоне 0.0 (начало) до 1.0 (конец);

·color — имя или код цвета, или его rgb/rgba представление.

Объекту градиента можно задать сколько угодно стоп цветов.

Дата добавления: 2015-06-27