Class Brush

A Brush holds color information and describes how to draw the inside of a Shape or the stroke of a shape or a TextBlock or the background of any GraphObject.

A Brush must not be modified once it has been assigned to a GraphObject, such as the Shape.fill or TextBlock.stroke or GraphObject.background. However, a Brush may be shared by multiple GraphObjects.

Constructor Summary Details

Name Description
Brush(type)

Construct a Brush class that holds the given color information.More...

Parameters:
{EnumValue|string=} type
Optional, one of the values Brush.Solid, Brush.Linear, Brush.Radial, Brush.Pattern, or a well-formed CSS string describing a solid color brush. No parameter defaults to a Brush.Solid with a color description of 'black'.

Properties Summary Details

Name, Value Type Description
color
{string}

Gets or sets the color of a solid Brush.

colorStops
{Map.}

Gets or sets a Map holding all of the color stops used in this gradient, where the key is a number, the fractional distance between zero and one (inclusive), and where the corresponding value is a color string.More...

Call addColorStop in order to add color stops to this brush. This property value may be null if no gradient stops have been defined.
end
{Spot}

Gets or sets the ending location for a linear or radial gradient.More... A Spot value specifies a relative point in the object's GraphObject.naturalBounds. This defaults to Spot.BottomCenter for linear gradients and Spot.Center for radial gradients.

endRadius
{number}

Gets or sets the radius of a radial brush at the end location.More... The default value is NaN.

pattern
{HTMLCanvasElement|HTMLImageElement}

Gets or sets the pattern of a brush of type Brush.Pattern.More... Must be a reference to an HTMLCanvasElement or HTMLImageElement.

start
{Spot}

Gets or sets the starting location for a linear or radial gradient.More... A Spot value specifies a relative point in the object's GraphObject.naturalBounds. This defaults to Spot.TopCenter for linear gradients and Spot.Center for radial gradients.

startRadius
{number}

Gets or sets the radius of a radial brush at the start location.More... This defaults to zero.

type
{EnumValue}

Gets or sets the type of brush.More... The value must be one of: Brush.Solid, Brush.Linear, Brush.Radial, Brush.Pattern. If the new value is a linear or radial brush type, and if the start or end spots are not specific spots, they are changed to be specific spots, depending on the type of brush.

Method Summary Details

Name, Return Type Description
addColorStop(loc, color)

Specify a particular color at a particular fraction of the distance.More... If the type is Brush.Solid, change the type to Brush.Linear. You should have a color stop at zero and a color stop at one. You should not have duplicate color stop values at the same fractional distance.

Parameters:
{number} loc
between zero and one, inclusive.
{string} color
copy()
{Brush}

Create a copy of this Brush, with the same values.

Returns:
{Brush}
<static>
Brush.darken(color)
{string} 1.7

This static function takes a color and darkens it by 20% in the Lab color space.More... This is a convenience function which calls Brush.darkenBy.

Parameters:
{string} color
a valid CSS color string
Returns:
{string} a CSS string for the darkened color in RGBA
darkenBy(fraction, mode)
{Brush} 1.7

Modifies all colors within this Brush, darkening them by some fraction.More...

Parameters:
{number=} fraction
to darken the colors, defaults to 0.2, must be between zero and one
{EnumValue=} mode
color space to use for adjusting; can be Brush.Lab or Brush.HSL, defaults to Brush.Lab
Returns:
{Brush} this Brush with modified color values
<static>
Brush.darkenBy(color, fraction, mode)
{string} 1.7

This static function takes a color and darkens it.More...

Parameters:
{string} color
a valid CSS color string
{number=} fraction
to darken the color, defaults to 0.2, must be between zero and one
{EnumValue=} mode
color space to use for adjusting; can be Brush.Lab or Brush.HSL, defaults to Brush.Lab
Returns:
{string} a CSS string for the darkened color in RGBA or HSLA
<static>
Brush.isValidColor(color)
{boolean} 1.7

This static function returns true if a given color string is well-formed for drawing.More...

Parameters:
{string} color
A color string to check
Returns:
{boolean}
<static>
Brush.lighten(color)
{string} 1.7

This static function takes a color and lightens it by 20% in the Lab color space.More... This is a convenience function which calls Brush.lightenBy.

Parameters:
{string} color
a valid CSS color string
Returns:
{string} a CSS string for the lightened color in RGBA
<static>
Brush.lightenBy(color, fraction, mode)
{string} 1.7

This static function takes a color and lightens it.More...

Parameters:
{string} color
a valid CSS color string
{number=} fraction
to lighten the color, defaults to 0.2, must be between zero and one
{EnumValue=} mode
color space to use for adjusting; can be Brush.Lab or Brush.HSL, defaults to Brush.Lab
Returns:
{string} a CSS string for the lightened color in RGBA or HSLA
lightenBy(fraction, mode)
{Brush} 1.7

Modifies all colors within this Brush, lightening them by some fraction.More...

Parameters:
{number=} fraction
to lighten the colors, defaults to 0.2, must be between zero and one
{EnumValue=} mode
color space to use for adjusting; can be Brush.Lab or Brush.HSL, defaults to Brush.Lab
Returns:
{Brush} this Brush with modified color values
<static>
Brush.randomColor(min, max)
{string}

This static function can be used to generate a random color.More...

Parameters:
{number=} min
a number between zero and 255, defaults to 128.
{number=} max
a number between zero and 255, defaults to 255.
Returns:
{string} a color value in # hexadecimal format.

Constants Summary Details

Name Description
HSL {EnumValue}

For lightening and darkening, used as a color-space value.

Lab {EnumValue}

For lightening and darkening, used as a color-space value.

Linear {EnumValue}

For linear gradient brushes, used as the value for Brush.type.

Pattern {EnumValue}

For pattern brushes, used as the value for Brush.type.

Radial {EnumValue}

For radial gradient brushes, used as the value for Brush.type.

Solid {EnumValue}

For simple, solid color brushes, used as the value for Brush.type.