Sets a gradient fill style. This is a WebGL only feature.
The gradient color values represent the 4 corners of an untransformed rectangle.
The gradient is used to color all filled shapes and paths drawn after calling this method.
If you wish to turn a gradient off, call fillStyle and provide a new single fill color.
When filling a triangle only the first 3 color values provided are used for the 3 points of a triangle.
This feature is best used only on rectangles and triangles. All other shapes will give strange results.
Note that for objects such as arcs or ellipses, or anything which is made out of triangles, each triangle used will be filled with a gradient on its own. There is no ability to gradient fill a shape or path as a single entity at this time.
| name | type | arguments | Default | description |
|---|---|---|---|---|
| topLeft | number |
The top left fill color. |
||
| topRight | number |
The top right fill color. |
||
| bottomLeft | number |
The bottom left fill color. |
||
| bottomRight | number |
The bottom right fill color. Not used when filling triangles. |
||
| alphaTopLeft | number | <optional> | 1 |
The top left alpha value. If you give only this value, it's used for all corners. |
| alphaTopRight | number | <optional> | 1 |
The top right alpha value. |
| alphaBottomLeft | number | <optional> | 1 |
The bottom left alpha value. |
| alphaBottomRight | number | <optional> | 1 |
The bottom right alpha value. |
This Game Object.