All docs
V19.2
24.2
The page you are viewing does not exist in version 24.2.
24.1
The page you are viewing does not exist in version 24.1.
23.2
The page you are viewing does not exist in version 23.2.
23.1
The page you are viewing does not exist in version 23.1.
22.2
The page you are viewing does not exist in version 22.2.
22.1
The page you are viewing does not exist in version 22.1.
21.2
The page you are viewing does not exist in version 21.2.
21.1
The page you are viewing does not exist in version 21.1.
20.2
The page you are viewing does not exist in version 20.2.
20.1
The page you are viewing does not exist in version 20.1.
19.2
19.1
18.2
18.1
17.2
Vue
A newer version of this page is available. Switch to the current version.

JavaScript/jQuery Funnel - item.hoverStyle.hatching

Applies hatching to a funnel item when a user presses the item or hovers the mouse pointer over it.

Type:

Object

Hatching fills a funnel item with parallel diagonal lines.

DevExtreme HTML5 JavaScript Funnel Item Hatching

direction

Specifies hatching line direction.

Type:

String

Default Value: 'right'
Accepted Values: 'left' | 'none' | 'right'

The following values are available:

  • none
    Does not apply hatching.
  • right
    Draws diagonal hatching lines upwards from left to right.
  • left
    Draws diagonal hatching lines downwards from left to right.

Use the HatchingDirection enum to specify this option when the widget is used as an ASP.NET MVC 5 Control or a DevExtreme-Based ASP.NET Core Control. This enum accepts the following values: Right, Left, and None.

opacity

Specifies the transparency of hatching lines.

Type:

Number

Default Value: 0.75

This option accepts a value from 0 to 1, where 0 makes hatching lines completely transparent, and 1 makes them opaque.

step

Specifies the distance between two side-by-side hatching lines in pixels.

Type:

Number

Default Value: 6

width

Specifies hatching lines' width in pixels.

Type:

Number

Default Value: 2