Paraan ng Canvas createRadialGradient()
Paglilinaw at Paggamit
createLinearGradient() Ang paraan na gumawa ng object ng gradient na pagbabagong kulay.
Ang gradient ay maaaring gamitin para sa paglalagay ng kulay sa parisukat, lupon, linya, teksto at iba pa.
Mga tagubilin:Gamitin ang bagay na ito bilang strokeStyle o fillStyle Halaga ng katangian.
Mga tagubilin:Gamitin ang addColorStop() Ang paraan ay nagtutukoy sa iba't ibang kulay at saan nasa gradient object ang pagkalagay ng kulay.
Eskwelahan
Ihanda ang isang parisukat at ilagay ang gradient na pagbabagong kulay sa pampalubog:
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");
// Ilagay ang gradient
ctx.fillStyle=grd;
ctx.fillRect(10,10,150,100);
Mga gramatika
context.createRadialGradient(x0,y0,r0,x1,y1,r1);
Halaga ng parameter
| Parameter | Paglalarawan |
|---|---|
| x0 | Ang x-coordinate ng pagsisimula ng gilid ng pagbabagong kulay. |
| y0 | Ang y-coordinate ng pagsisimula ng gilid ng pagbabagong kulay. |
| r0 | Ang laki ng pagsisimula ng gilid. |
| x1 | Ang x-coordinate ng huling gilid ng pagbabagong kulay. |
| y1 | Ang y-coordinate ng huling gilid ng pagbabagong kulay. |
| r1 | Ang laki ng gilid ng huling lupon. |
Suporta ng browser
Ang mga numero sa talahanayan ay naglalarawan ng unang bersyon ng browser na ganap na sumusuporta sa katangian na ito.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
注释：Internet Explorer 8 以及更早的版本不支持 <canvas> 元素。
