Name
CanvasRenderingContext2D.createRadialGradient( ): create a radial color gradient
Synopsis
CanvasGradient createRadialGradient(floatxStart, floatyStart, floatradiusStart, floatxEnd, floatyEnd, floatradiusEnd)
Arguments
-
xStart, yStart The coordinates of the center of the starting circle.
-
radiusStart The radius of the starting circle.
-
xEnd, yEnd The coordinates of the center of the ending circle.
-
radiusEnd The radius of the ending circle.
Returns
A CanvasGradient object representing a radial color gradient.
Description
This method creates and returns a new CanvasGradient object
that radially interpolates colors between the circumferences of the
two specified circles. Note that this method does not specify any
colors for the gradient. Use the addColorStop( ) method of the returned
object to do that. To stroke lines or fill areas using a gradient,
assign a CanvasGradient object to the strokeStyle or fillStyle properties.
Radial gradients are rendered by using the color at offset 0 for the circumference of the first circle, the color at offset 1 for the second circle, and interpolated color values (red, green, blue, and alpha) at circles between the two.
See Also
CanvasGradient.addColorStop(
), CanvasRenderingContext2D.createLinearGradient(
)
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access