React Chart - legend.border

Configures the legend's border.

Type:

Object

color

Colors the legend's border.

Type:

String

Default Value: '#d3d3d3'

This property supports the following colors:

NOTE
Make the legend's border visible by setting the legend.border.visible property to true.

cornerRadius

Makes all the legend's corners rounded.

Type:

Number

Default Value: 0

This property accepts a positive number that defines a quarter ellipse's horizontal and vertical radii which determine the corner's curvature.

dashStyle

Sets a dash style for the legend's border.

Type:

String

Default Value: 'solid'
Accepted Values: 'dash' | 'dot' | 'longDash' | 'solid'

The following dash styles are available:

  • solid
    The border is a solid, continuous line.

  • longDash
    The border is displayed using long dashes.

  • dash
    The border is displayed using dashes.

  • dot
    The border is displayed using dots.

  • Any combination of 'longDash', 'dash' and 'dot'
    The border is displayed by repeating the specified combination. For instance, 'dashdotdash'.

Use the DashStyle enum to specify this property when the UI component is used as an ASP.NET MVC 5 Control or a DevExtreme-Based ASP.NET Core Control. This enum accepts the following values: Solid, LongDash, Dash, and Dot.

opacity

Specifies the transparency of the legend's border.

Type:

Number

Default Value: undefined

This property accepts a value from 0 to 1, where 0 makes the border completely transparent, and 1 makes it opaque.

visible

Shows the legend's border.

Type:

Boolean

Default Value: false

width

Specifies the width of the legend's border in pixels.

Type:

Number

Default Value: 1