All docs
V20.2
21.1
20.2
20.1
19.2
The page you are viewing does not exist in version 19.2. This link will take you to the root page.
19.1
The page you are viewing does not exist in version 19.1. This link will take you to the root page.
18.2
The page you are viewing does not exist in version 18.2. This link will take you to the root page.
18.1
The page you are viewing does not exist in version 18.1. This link will take you to the root page.
17.2
The page you are viewing does not exist in version 17.2. This link will take you to the root page.
Box
Map
Vue

strips[]

Declares a collection of strips belonging to the argument axis.

Type:

Array<Object>

Cannot be used in themes.

A strip is a colored piece of the chart's background that highlights a range of values. Strips allow a viewer to see whether a certain series point falls in or out of a range.

DevExtreme HTML5 Charts Strips

Each object in the strips array configures a single strip. To limit a strip, set its startValue and endValue properties. You may set only one of them, in which case the strip will not have a limit at one end. Note that setting the color property is also necessary for a strip to be displayed.

See Also
  • argumentAxis.stripStyle - specifies the appearance of those strips that belong to the argument axis.
  • commonAxisSettings.stripStyle - specifies the appearance of all strips in the UI component.

color

Specifies the color of the strip.

Type:

String

Default Value: undefined

This property supports the following colors:

endValue

Along with the startValue property, limits the strip.

Type:

Number

|

Date

|

String

Default Value: undefined

label

Configures the strip label.

Type:

Object

Setting the text property is necessary for a strip label to be displayed.

See Also
  • argumentAxis.stripStyle.label - specifies a unified style for the labels of those strips that belong to the argument axis.
  • commonAxisSettings.stripStyle.label - specifies a unified style for the labels of all strips in the UI component.

paddingLeftRight

Generates a pixel-measured empty space between the left/right border of a strip and the strip label.

Type:

Number

Default Value: 10

This property depends on the label.horizontalAlignment in the following way.

  • horizontalAlignment is "left" → padding applies to the left border of a strip;
  • horizontalAlignment is "right" → padding applies to the right border of a strip;
  • horizontalAlignment is "center" → padding is calculated automatically.

DevExtreme HTML5 Charts StripPadding

See Also
  • commonAxisSettings.stripStyle.label.horizontalAlignment - aligns strip labels in the horizontal direction. Applies to all strips.
  • argumentAxis.stripStyle.label.horizontalAlignment - aligns strip labels in the horizontal direction. Applies to the strips belonging to the argument axis.
  • valueAxis.stripStyle.label.horizontalAlignment - aligns strip labels in the horizontal direction. Applies to the strips belonging to the value axis.

paddingTopBottom

Generates a pixel-measured empty space between the top/bottom border of a strip and the strip label.

Type:

Number

Default Value: 5

This property depends on the label.verticalAlignment in the following way.

  • verticalAlignment is "top" → padding applies to the top border of a strip;
  • verticalAlignment is "bottom" → padding applies to the bottom border of a strip;
  • verticalAlignment is "center" → padding is calculated automatically.

DevExtreme HTML5 Charts StripPadding

See Also
  • commonAxisSettings.stripStyle.label.verticalAlignment - aligns strip labels in the vertical direction. Applies to all strips.
  • argumentAxis.stripStyle.label.verticalAlignment - aligns strip labels in the vertical direction. Applies to the strips belonging to the argument axis.
  • valueAxis.stripStyle.label.verticalAlignment - aligns strip labels in the vertical direction. Applies to the strips belonging to the value axis.

startValue

Along with the endValue property, limits the strip.

Type:

Number

|

Date

|

String

Default Value: undefined