Vue Chart - panes.border

Configures the pane border.

Selector: DxBorder
Type:

Object

DevExtreme HTML5 Charts Panes PaneBorder

bottom

Shows/hides the bottom border of the pane. Applies only when the border.visible property is true.

Type:

Boolean

Default Value: true

color

Specifies the color of the pane border.

Type:

String

Default Value: '#d3d3d3'

This property supports the following colors:

dashStyle

Specifies the dash style of the pane border.

Selector: dash-style
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'.

left

Shows/hides the left border of the pane. Applies only when the border.visible property is true.

Type:

Boolean

Default Value: true

opacity

Specifies how transparent the pane border should be.

Type:

Number

Default Value: undefined

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

right

Shows/hides the right border of the pane. Applies only when the border.visible property is true.

Type:

Boolean

Default Value: true

top

Shows/hides the top border of the pane. Applies only when the border.visible property is true.

Type:

Boolean

Default Value: true

visible

Shows the pane border.

Type:

Boolean

Default Value: false

When this property is set to true, you can control each side of the border separately using the top, bottom, left and right properties.

width

Specifies the width of the pane border in pixels.

Type:

Number

Default Value: 1