{{APIRef("Canvas API")}}
The CanvasGradient
interface represents an opaque object describing a gradient. It is returned by the methods {{domxref("CanvasRenderingContext2D.createLinearGradient()")}} or {{domxref("CanvasRenderingContext2D.createRadialGradient()")}}.
Properties
Representing an opaque object, there is no exposed property.
Methods
There is no inherited method.
- {{domxref("CanvasGradient.addColorStop()")}}
- Adds a new stop, defined by an
offset
and acolor
, to the gradient. If the offset is not between0
and1
anINDEX_SIZE_ERR
is raised, if the color can't be parsed as a CSS {{xref_csscolorvalue}}, aSYNTAX_ERR
is raised.
Specifications
Specification | Status | Comment |
---|---|---|
{{SpecName('HTML WHATWG', "the-canvas-element.html#canvasgradient", "CanvasGradient")}} | {{Spec2('HTML WHATWG')}} |
Browser compatibility
{{CompatibilityTable}}
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | 4.0 | {{CompatGeckoDesktop("1.9.2")}} [1] | 9.0 | 9.0 | 3.1 |
Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | 2.1 | {{CompatGeckoMobile("1.9.2")}} [1] | {{CompatUnknown}} | 10.0 | 3.2 |
[1] Before Gecko 5.0, (Firefox 5.0 / Thunderbird 5.0 / SeaMonkey 2.2), specifying non-finite values when adding color stops through a call to addColorStop()
incorrectly throws SYNTAX_ERR
instead of INDEX_SIZE_ERR
.
See also
- Creator methods in {{domxref("CanvasRenderingContext2D")}}.
- The {{HTMLElement("canvas")}} element and its associated interface, {{domxref("HTMLCanvasElement")}}.