Funnel

Basic Options

chevron-rightNamehashtag

Type: string

Documentation: Sets the trace name. The trace name appears as the legend item and on hover.

Path: data.index.name

chevron-rightOffsethashtag

Type: number

Accept List: false

Documentation: Shifts the position where the bar is drawn (in position axis units). In group barmode, traces that set offset will be excluded and drawn in overlay mode instead.

Path: data.index.offset

chevron-rightOpacityhashtag

Default Value: 1

Type: number

Min: 0

Max: 1

Documentation: Sets the opacity of the trace.

Path: data.index.opacity

chevron-rightOrientationhashtag

Type: enumerated

Enum Options: v,h

Documentation: Sets the orientation of the funnels. With v (h), the value of the each bar spans along the vertical (horizontal). By default funnels are tend to be oriented horizontally; unless only y array is presented or orientation is set to v. Also regarding graphs including only 'horizontal' funnels, autorange on the y-axis are set to reversed.

Path: data.index.orientation


Data Source

chevron-rightTexthashtag

Default Value:

Type: string

Accept List: true

Documentation: Sets text elements associated with each (x,y) pair. If a single string, the same string appears over all the data points. If an array of string, the items are mapped in order to the this trace's (x,y) coordinates. If trace hoverinfo contains a text flag and hovertext is not set, these elements will be seen in the hover labels.

Path: data.index.text

chevron-rightXhashtag

Type: any

Accept List: true

Documentation: Sets the x coordinates.

Path: data.index.x

chevron-rightYhashtag

Type: any

Accept List: true

Documentation: Sets the y coordinates.

Path: data.index.y


Connector Options

chevron-rightFill Colorhashtag

Type: color

Documentation: Sets the fill color.

Path: data.index.connector.fillcolor

chevron-rightLine Colorhashtag

Default Value: #444

Type: color

Documentation: Sets the line color.

Path: data.index.connector.line.color

chevron-rightLine Dashhashtag

Default Value: solid

Type: string

Enum Options: solid,dot,dash,longdash,dashdot,longdashdot

Documentation: Sets the dash style of lines. Set to a dash type string (solid, dot, dash, longdash, dashdot, or longdashdot) or a dash length list in px (eg 5px,10px,2px,2px).

Path: data.index.connector.line.dash

chevron-rightLine Widthhashtag

Default Value: 0

Type: number

Min: 0

Documentation: Sets the line width (in px).

Path: data.index.connector.line.width

chevron-rightVisiblehashtag

Default Value: true

Type: boolean

Documentation: Determines if connector regions and lines are drawn.

Path: data.index.connector.visible


Items Styling

chevron-rightColorhashtag

Type: color

Accept List: true

Documentation: Sets the marker color. It accepts either a specific color or an array of numbers that are mapped to the colorscale relative to the max and min values of the array or relative to marker.cmin and marker.cmax if set.

Path: data.index.marker.color

chevron-rightLine Colorhashtag

Type: color

Accept List: true

Documentation: Sets the marker.line color. It accepts either a specific color or an array of numbers that are mapped to the colorscale relative to the max and min values of the array or relative to marker.line.cmin and marker.line.cmax if set.

Path: data.index.marker.line.color

chevron-rightLine Widthhashtag

Default Value: 0

Type: number

Accept List: true

Min: 0

Documentation: Sets the width (in px) of the lines bounding the marker points.

Path: data.index.marker.line.width

chevron-rightOpacityhashtag

Default Value: 1

Type: number

Accept List: true

Min: 0

Max: 1

Documentation: Sets the opacity of the bars.

Path: data.index.marker.opacity

chevron-rightWidthhashtag

Type: number

Accept List: false

Min: 0

Documentation: Sets the bar width (in position axis units).

Path: data.index.width


Calendar Options

chevron-rightX Periodhashtag

Default Value: 0

Type: any

Documentation: Only relevant when the axis type is date. Sets the period positioning in milliseconds or M on the x axis. Special values in the form of M could be used to declare the number of months. In this case n must be a positive integer.

Path: data.index.xperiod

chevron-rightX Period Alignmenthashtag

Default Value: middle

Type: enumerated

Enum Options: start,middle,end

Documentation: Only relevant when the axis type is date. Sets the alignment of data points on the x axis.

Path: data.index.xperiodalignment


Text Formatting

chevron-rightInside Text Anchorhashtag

Default Value: middle

Type: enumerated

Enum Options: end,middle,start

Documentation: Determines if texts are kept at center or start/end points in textposition inside mode.

Path: data.index.insidetextanchor

chevron-rightText Anglehashtag

Default Value: auto

Type: angle

Documentation: Sets the angle of the tick labels with respect to the bar. For example, a tickangle of -90 draws the tick labels vertically. With auto the texts may automatically be rotated to fit with the maximum size in bars.

Path: data.index.textangle

chevron-rightColorhashtag

Type: color

Accept List: true

Path: data.index.textfont.color

chevron-rightSizehashtag

Type: number

Accept List: true

Min: 1

Path: data.index.textfont.size

chevron-rightText Positionhashtag

Default Value: auto

Type: enumerated

Accept List: true

Enum Options: inside,outside,auto,none

Documentation: Specifies the location of the text. inside positions text inside, next to the bar end (rotated and scaled if needed). outside positions text outside, next to the bar end (scaled if needed), unless there is another bar stacked on this one, then the text gets pushed inside. auto tries to position text inside the bar, but if the bar is too small and no bar is stacked on this one the text is moved outside. If none, no text appears.

Path: data.index.textposition

chevron-rightText Templatehashtag

Default Value:

Type: string

Accept List: true

Documentation: Template string used for rendering the information text that appear on points. Note that this will override textinfo. Variables are inserted using %{variable}, for example "y: %{y}". Numbers are formatted using d3-format's syntax %{variable:d3-format}, for example "Price: %{y:$.2f}". https://github.com/d3/d3-format/tree/v1.4.5#d3-format for details on the formatting syntax. Dates are formatted using d3-time-format's syntax %{variable|d3-time-format}, for example "Day: %{2019-01-01|%A}". https://github.com/d3/d3-time-format/tree/v2.2.3#locale_format for details on the date formatting syntax. Every attributes that can be specified per-point (the ones that are arrayOk: true) are available. Finally, the template string has access to variables value and label.

Path: data.index.texttemplate

chevron-rightInside Text Anchorhashtag

Default Value: end

Type: enumerated

Enum Options: end,middle,start

Documentation: Determines if texts are kept at center or start/end points in textposition inside mode.

Path: data.index.insidetextanchor


Hover Formatting

chevron-rightHover Infohashtag

Default Value: all

Type: flaglist

Accept List: true

Flag Options: x,y,z,text,name

Flag Single: all,none,skip

Documentation: Determines which trace information appear on hover. If none or skip are set, no information is displayed upon hovering. But, if none is set, click and hover events are still fired.

Path: data.index.hoverinfo

chevron-rightHover Templatehashtag

Default Value:

Type: string

Accept List: true

Documentation: Template string used for rendering the information that appear on hover box. Note that this will override hoverinfo. Variables are inserted using %{variable}, for example "y: %{y}" as well as %{xother}, {%xother}, {%xother}, {%xother}. When showing info for several points, xother will be added to those with different x positions from the first point. An underscore before or after (x|y)other will add a space on that side, only when this field is shown. Numbers are formatted using d3-format's syntax %{variable:d3-format}, for example "Price: %{y:$.2f}". https://github.com/d3/d3-format/tree/v1.4.5#d3-format for details on the formatting syntax. Dates are formatted using d3-time-format's syntax %{variable|d3-time-format}, for example "Day: %{2019-01-01|%A}". https://github.com/d3/d3-time-format/tree/v2.2.3#locale_format for details on the date formatting syntax. The variables available in hovertemplate are the ones emitted as event data described at this link https://plotly.com/javascript/plotlyjs-events/#event-data. Additionally, every attributes that can be specified per-point (the ones that are arrayOk: true) are available. Finally, the template string has access to variables value and label. Anything contained in tag <extra> is displayed in the secondary box, for example "{fullData.name}". To hide the secondary box completely, use an empty tag <extra></extra>.

Path: data.index.hovertemplate

Last updated