Pie & Donut
Basic Options
Direction
Default Value: counterclockwise
Type: enumerated
Enum Options: clockwise,counterclockwise
Documentation: Specifies the direction at which succeeding sectors follow one another.
Path: data.index.direction
Hole
Default Value: 0
Type: number
Min: 0
Max: 1
Documentation: Sets the fraction of the radius to cut out of the pie. Use this to make a donut chart.
Path: data.index.hole
Name
Type: string
Documentation: Sets the trace name. The trace name appears as the legend item and on hover.
Path: data.index.name
Opacity
Default Value: 1
Type: number
Min: 0
Max: 1
Documentation: Sets the opacity of the trace.
Path: data.index.opacity
Pull
Default Value: 0
Type: number
Accept List: true
Min: 0
Max: 1
Documentation: Sets the fraction of larger radius to pull the sectors out from the center. This can be a constant to pull all slices apart from each other equally or an array to highlight one or more slices.
Path: data.index.pull
Rotation
Default Value: 0
Type: angle
Documentation: Instead of the first slice starting at 12 o'clock, rotate to some other angle.
Path: data.index.rotation
Sort
Default Value: true
Type: boolean
Documentation: Determines whether or not the sectors are reordered from largest to smallest.
Path: data.index.sort
Data Source
Labels
Type: any
Accept List: true
Documentation: Sets the sector labels. If labels entries are duplicated, we sum associated values or simply count occurrences if values is not provided. For other array attributes (including color) we use the first non-empty entry among all occurrences of the label.
Path: data.index.labels
Text
Type: any
Accept List: true
Documentation: Sets text elements associated with each sector. If trace textinfo contains a text flag, these elements will be seen on the chart. 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
Values
Type: any
Accept List: true
Documentation: Sets the values of the sectors. If omitted, we count occurrences of each label.
Path: data.index.values
Title Attributes
Position
Type: enumerated
Enum Options: top left,top center,top right,middle center,bottom left,bottom center,bottom right
Documentation: Specifies the location of the title. Note that the title's position used to be set by the now deprecated titleposition attribute.
Path: data.index.title.position
Text
Default Value:
Type: string
Documentation: Sets the title of the chart. If it is empty, no title is displayed. Note that before the existence of title.text, the title's contents used to be defined as the title attribute itself. This behavior has been deprecated.
Path: data.index.title.text
Items Styling
Colors
Type: any
Accept List: true
Documentation: Sets the color of each sector. If not specified, the default trace color set is used to pick the sector colors.
Path: data.index.marker.colors
Line Color
Default Value: #444
Type: color
Accept List: true
Documentation: Sets the color of the line enclosing each sector.
Path: data.index.marker.line.color
Line Width
Default Value: 0
Type: number
Accept List: true
Min: 0
Documentation: Sets the width (in px) of the line enclosing each sector.
Path: data.index.marker.line.width
Items Pattern Options
Pattern Fg Color
Type: color
Accept List: true
Documentation: When there is no colorscale sets the color of foreground pattern fill. Defaults to a marker.color background when fillmode is replace. Otherwise, defaults to dark grey or white to increase contrast with the bgcolor.
Path: data.index.marker.pattern.fgcolor
Pattern Fill Mode
Default Value: replace
Type: enumerated
Enum Options: replace,overlay
Documentation: Determines whether marker.color should be used as a default to bgcolor or a fgcolor.
Path: data.index.marker.pattern.fillmode
Pattern Shape
Default Value:
Type: enumerated
Accept List: true
Enum Options: ,/,,x,-,|,+,.
Documentation: Sets the shape of the pattern fill. By default, no pattern is used for filling the area.
Path: data.index.marker.pattern.shape
Pattern Size
Default Value: 8
Type: number
Accept List: true
Min: 0
Documentation: Sets the size of unit squares of the pattern fill in pixels, which corresponds to the interval of repetition of the pattern.
Path: data.index.marker.pattern.size
Text Formatting
Auto Margin
Default Value: false
Type: boolean
Documentation: Determines whether outside text labels can push the margins.
Path: data.index.automargin
Inside Text Orientation
Default Value: auto
Type: enumerated
Enum Options: horizontal,radial,tangential,auto
Documentation: Controls the orientation of the text inside chart sectors. When set to auto, text may be oriented in any direction in order to be as big as possible in the middle of a sector. The horizontal option orients text to be parallel with the bottom of the chart, and may make text smaller in order to achieve that goal. The radial option orients text along the radius of the sector. The tangential option orients text perpendicular to the radius of the sector.
Path: data.index.insidetextorientation
Text Angle
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
Text Position
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
Text Template
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
Inside Text Anchor
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
Hover Info
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
Hover Template
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