Skip to main content

Pie

Name#

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

In the Name text box, the name can be entered and formatted. This is automatically reflected in the Structure > Traces[link] section and in the legend[link] of the chart. The trace name can be also edited directly by double-clicking the trace name in the chart legend.

HTML tags and CSS formatting can be used to enrich text styling.

Trace Opacity#

Sets the opacity (transparency) of the trace.

Segment Colors#

Colors#

Clicking on the colored bar next to "Colors" hides or reveals an extra menu, allowing the popup choice of these classes of color scales:

  • sequential scales Use sequential colorscales for data that smoothly changes value and has meaningful order.

  • divergent scales Use divergent colorscales for data that smoothly changes around a centerpoint (such as zero).

  • categorical scales Use categorical colorscales for data that has distinct groups and a non-meaningful order.

  • cyclical scales Use cyclical colorscales for data that has a natural cycle, such as angular, diurnal or seasonal data.

  • cubehelix scales Cubehelix colorscales are like sequential scales, but have the added benefit of printing clearly in black & white. Adjust the "start" slider to change the scale's base color. A cubehelix scale with 0 rotation transitions through a single base color. A scale with non-zero rotation "rotates" through other colors. Change the rotation slightly to add a touch of another color, change it more to create a scale with multiple colors.

  • cmocean scales cmocean colorscales are a mix of sequential and diverging scales. They were originally developed for oceanography data, but can be applied beautifully to any other type of data as well.

Extended Colors#

When more data than colors is present, the available colors in the chosen scale are exhausted; this has two solutions:

  • On prevent repetition by adding random colors.

  • Off reuses (repeats) the indicated colors.

Subchart Title#

Name#

The pie chart can have its own title, which is entered by filling text in the Subchart Title > Name field. The subchart title will be placed in the middle when Segment > Hole Size[link] is large enough, or atop the pie chart otherwise.

Segments#

Shape, order and arrangement of the segments is set in this pane.

Order#

  • Sorted Segments can be sorted by size, starting with the largest segment working toward the smallest segment.

  • Unsorted takes the order of the grid rows for placing the segments.

Direction#

  • Clockwise is the default direction when placing the segments (starting at 12 o'clock, unless Segments > Rotation is not zero)

  • Counterclockwise reverses the direction of the placement

Rotation#

To place the desired segment "at twelve o'clock", Rotation (in degrees) can be used. Positive numbers rotate clockwise, negative numbers rotate counterclockwise.

Hole Size#

The center of the pie chart can be blanked to make room for the Name[link] of the subchart. The text size of the subchart name will be scaled down as far as necessary and possible.

Pull#

Padding of the pie segments is determined as fraction of two adjacent segments: larger segments cause larger gaps between segments.

Border Width#

Around each pie segment a border is placed increasing inward and outward size of the segment. On narrow Pull settings, this will join two segments by their border.

Border Color#

Only available when Border Width has a non-zero value.

The default color picker[link] is used to set the color of the segment border, if present.

Text#

Text added to the pie chart segments

Text Position#

Depending on choosing All or Custom various popups appear

  • All places all segment texts on the same relative position. * *Inside The segment text is placed inside the segment regardless of the available space in the chart. The text is placed horizontal in larger segments and aligned with the segment's rotation when space is scarce. This is set in the conditional popup Inside Text Orientation below. Outside places the segment text in the perimeter of the segment * *Auto uses inside when enough space is available and outside for small segments when utside the circle of the pie chart the rectangular chart area has enough space. None does not show any segment text in the chart

  • Custom This should[bug] position text values individually, according to the provided data positions array. The popup Data inlined in Figure appears and provides an option to chose a grid colum that holds combinations of [Top, Middle, Bottom] and [Left, Center,Right]

Mode#

  • Values will display the values taken from the data grid as plain text.

    • Template shows an edit panel for the template string used for rendering the information text. 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}". Dates and times are formatted using d3-time-format's syntax %{variable|d3-time-format}, for example "Day: %{2019-01-01|%A}".

Show#

Show or hide information of the pie segments. Contains a hidden Text option that is activated by chosing a grid column in Text below. Tick any you want:

  • Label shows the text as per grid text column

  • Value shows the absolute value from the grid cells

  • % displays the relative percentage of the segment

  • Text

    Only available when a text grid column has been chosen in Text below.

Text#

The grid column[link], holding the text to be shown for each item on hover, can be chosen here. Only data-containing columns can be selected.

Typeface#

HTML font family - the typeface that will be applied by the web browser. The web browser will only be able to apply a font if it is available on the system in which it operates. Plotly has a set of standard fonts available on all platforms, containing Arial, Balto, Courier New, Droid Sans, Droid Serif, Droid Sans Mono, Gravitas One, Old Standard TT, Open Sans, Overpass, PT Sans Narrow, Raleway and Times New Roman.

Font Size#

Size of the typeface in pixels.

Font Color#

Specifies the color of the font, set using the default color picker[link]

Inside Text Orientation#

Only available when Text > Text Positions is set to inside.

The text is rotated according to the setting below. When not enough space is available, the text is shown in a smaller size, regardless of the ***Font Size*** set above.

  • Auto displays the segment text with a combination of horizontal, radial and tangential, whichever fits best.

  • Radial places the text aligned with the segment's axis, toward the center

  • Tangential places the text perpendicular to the segment's axis

  • Horizontal places the text horizontally

Scaling#

Scale Group#

If there are multiple pie charts that should be sized according to their totals, place every trace in the same group. Seems defunct[bug]: groups can be added and chosen but selecting from the popup returns to Select an Option***

Hover/Tooltip#

Mode#

  • Values tooltips will show actual data values on hover.
  • Template tooltips will show custom-formatted values on hover. This option also enables the template formatting field.

Show#

Show or hide information of the pie segments when being hovered over. Contains a hidden Text option that is activated by chosing a grid column in Text below. Tick any you want:

  • Percent displays the relative percentage of the segment

  • Label shows the text as per grid text column

  • Value shows the absolute value from the grid cells

  • Text

    Only available when a text grid column has been chosen in Text above.

  • Trace name

    Only available when a text grid column has been chosen in Text above.

Trace Name#

Only appears when Trace name is ticked in the Show menu

  • Clip To The trace name is partially shown in a side pane attached to the hover pane. Opens extra numerical data field.
  • No Clip An extra side-panel is added to the hover pane, showing the entire trace name.
  • Hide No trace name is shown in the hover info pane.
  • px Numerical field to enter the number of pixels the trace name will be clipped to, only appears when Clip To is selected.

Text Alignment#

Sets the horizontal alignment of the text content within the hover label box. Has an effect only if the hover label text spans two or more lines. Alignment of Hover/Tooltip can be set to Auto, Left or Right.