border

Specifies legend border options.

Type:

Object

Use this object to make a legend's border visible/invisible and set up such border options as color, width etc.

Show Example:
jQuery

This example shows how to customize the appearance of the legend border.


                                    

                                    

color

Specifies border color.

Type:

String

Default Value: '#d3d3d3'

This option supports the following colors.

  • Hexadecimal colors
  • RGB colors
  • RGBA colors (not supported in Internet Explorer 8)
  • Predefined/cross-browser color names
  • Predefined SVG colors (not supported in Internet Explorer 8)

To make the border visible, set the visible property to true.

Show Example:
jQuery

In this example, the color option of the legend border is set to lightseagreen.


                                    

                                    

cornerRadius

Specifies a radius of a border's corners in degrees.

Type:

Number

Default Value: 0

Use this property to round a legend's border.

Show Example:
jQuery

In this example, the legend border's cornerRadius option is set to 15.


                                    

                                    

dashStyle

Specifies the border's dash style in the legend.

Type:

String

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

The following values are available:

  • solid
    Displays a solid, continuous line.
  • longDash
    Displays a border using long dashes.
  • dash
    Displays a border using dashes.
  • dot
    Displays a border using dots.
  • Any combination of 'longDash', 'dash' and 'dot'
    Displays a border by repeating the specified combination. For instance, 'dashdotdash'.
Show Example:
jQuery

In this example, the legend border's dash style is changed to longDashdot. The cornerRadius and width options are also changed.


                                    

                                    

opacity

Specifies a border's opacity.

Type:

Number

Default Value: undefined

Show Example:
jQuery

In this example, the legend border's opacity option is set to 1.


                                    

                                    

visible

Sets a legend's border visibility state.

Type:

Boolean

Default Value: false

Show Example:
jQuery

Use the check box at the bottom to change the visibility of the legend border.


                                    

                                    

width

Specifies a border's width, in pixels.

Type:

Number

Default Value: 1

Show Example:
jQuery

In this example, the legend border's width option is set to 3. The color and cornerRadius options are also changed.