HTML холст createRadialGradient() Метод
Пример
Нарисуйте прямоугольник и заполните радиальным/круговым градиентом:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var grd=ctx.createRadialGradient(75,50,5,90,60,100);
grd.addColorStop(0,"red");
grd.addColorStop(1,"white");
// Fill with gradient
ctx.fillStyle=grd;
ctx.fillRect(10,10,150,100);
Поддержка браузера
Номера в таблице указывают первую версию браузера, которая полностью поддерживает этот метод.
| Метод | |||||
|---|---|---|---|---|---|
| createRadialGradient() | Да | 9.0 | Да | Да | Да |
Определение и использование
Метод createRadialGradient() создает радиальный/циклический градиентный объект.
Градиент может быть использован для заполнения прямоугольников, окружностей, линий, текста и т.д.
Совет: Используйте этот объект в качестве значения свойств strokeStyle или fillStyle.
Совет: Используйте метод addcolorstop() для задания различных цветов и расположения цветов в объекте градиента.
| Синтаксис JavaScript: | context.createRadialGradient(x0,y0,r0,x1,y1,r1); |
|---|
❮ HTML Справка на полотно