# Configuration

### Mode Bar Options

<details>

<summary>Display Mode Bar</summary>

**Default Value**: hover

**Type**: enumerated

**Enum Options**: hover,true,false

**Documentation**: Determines the mode bar display mode. If *true*, the mode bar is always visible. If *false*, the mode bar is always hidden. If *hover*, the mode bar is visible while the mouse cursor is on the graph container.

**Path**: config.displayModeBar

</details>

<details>

<summary>Mode Bar Buttons To Remove</summary>

**Default Value**: \[List]

**Type**: any

**Documentation**: Remove mode bar buttons by name. See ./components/modebar/buttons.js for the list of names.

**Path**: config.modeBarButtonsToRemove

</details>

<details>

<summary>Active Color</summary>

**Type**: color

**Documentation**: Sets the color of the active or hovered on icons in the modebar.

**Path**: layout.modebar.activecolor

</details>

<details>

<summary>Bg Color</summary>

**Type**: color

**Documentation**: Sets the background color of the modebar.

**Path**: layout.modebar.bgcolor

</details>

<details>

<summary>Color</summary>

**Type**: color

**Documentation**: Sets the color of the icons in the modebar.

**Path**: layout.modebar.color

</details>

<details>

<summary>Orientation</summary>

**Default Value**: h

**Type**: enumerated

**Enum Options**: v,h

**Documentation**: Sets the orientation of the modebar.

**Path**: layout.modebar.orientation

</details>

***

### Chart Configurations

<details>

<summary>Editable</summary>

**Default Value**: false

**Type**: boolean

**Documentation**: Determines whether the graph is editable or not. Sets all pieces of `edits` unless a separate `edits` config item overrides individual parts.

**Path**: config.editable

</details>

<details>

<summary>Scroll Zoom</summary>

**Default Value**: gl3d+geo+mapbox

**Type**: flaglist

**Flag Options**: cartesian,gl3d,geo,mapbox

**Flag Single**: true,false

**Documentation**: Determines whether mouse wheel or two-finger scroll zooms is enable. Turned on by default for gl3d, geo and mapbox subplots (as these subplot types do not have zoombox via pan), but turned off by default for cartesian subplots. Set `scrollZoom` to *false* to disable scrolling for all subplots.

**Path**: config.scrollZoom

</details>

<details>

<summary>Static Plot</summary>

**Default Value**: false

**Type**: boolean

**Documentation**: Determines whether the graphs are interactive or not. If *false*, no interactivity, for export or image generation.

**Path**: config.staticPlot

</details>

***

### Interacting Options

<details>

<summary>Show Tips</summary>

**Default Value**: true

**Type**: boolean

**Documentation**: Determines whether or not tips are shown while interacting with the resulting graphs.

**Path**: config.showTips

</details>

<details>

<summary>Click Mode</summary>

**Default Value**: event

**Type**: flaglist

**Flag Options**: event,select

**Flag Single**: none

**Documentation**: Determines the mode of single click interactions. *event* is the default value and emits the `plotly_click` event. In addition this mode emits the `plotly_selected` event in drag modes *lasso* and *select*, but with no event data attached (kept for compatibility reasons). The *select* flag enables selecting single data points via click. This mode also supports persistent selections, meaning that pressing Shift while clicking, adds to / subtracts from an existing selection. *select* with `hovermode`: *x* can be confusing, consider explicitly setting `hovermode`: *closest* when using this feature. Selection events are sent accordingly as long as *event* flag is set as well. When the *event* flag is missing, `plotly_click` and `plotly_selected` events are not fired.

**Path**: layout.clickmode

</details>

<details>

<summary>Drag Mode</summary>

**Default Value**: zoom

**Type**: enumerated

**Enum Options**: zoom,pan,select,lasso,drawclosedpath,drawopenpath,drawline,drawrect,drawcircle,orbit,turntable,false

**Documentation**: Determines the mode of drag interactions. *select* and *lasso* apply only to scatter traces with markers or text. *orbit* and *turntable* apply only to 3D scenes.

**Path**: layout.dragmode

</details>

<details>

<summary>Hover Distance</summary>

**Default Value**: 20

**Type**: integer

**Min**: -1

**Documentation**: Sets the default distance (in pixels) to look for data to add hover labels (-1 means no cutoff, 0 means no looking for data). This is only a real distance for hovering on point-like objects, like scatter points. For area-like objects (bars, scatter fills, etc) hovering is on inside the area and off outside, but these objects will not supersede hover on point-like objects in case of conflict.

**Path**: layout.hoverdistance

</details>

<details>

<summary>Hover Mode</summary>

**Default Value**: closest

**Type**: enumerated

**Enum Options**: x,y,closest,false,x unified,y unified

**Documentation**: Determines the mode of hover interactions. If *closest*, a single hoverlabel will appear for the *closest* point within the `hoverdistance`. If *x* (or *y*), multiple hoverlabels will appear for multiple points at the *closest* x- (or y-) coordinate within the `hoverdistance`, with the caveat that no more than one hoverlabel will appear per trace. If *x unified* (or *y unified*), a single hoverlabel will appear multiple points at the closest x- (or y-) coordinate within the `hoverdistance` with the caveat that no more than one hoverlabel will appear per trace. In this mode, spikelines are enabled by default perpendicular to the specified axis. If false, hover interactions are disabled.

**Path**: layout.hovermode

</details>

<details>

<summary>Spike Distance</summary>

**Default Value**: -1

**Type**: integer

**Min**: -1

**Documentation**: Sets the default distance (in pixels) to look for data to draw spikelines to (-1 means no cutoff, 0 means no looking for data). As with hoverdistance, distance does not apply to area-like objects. In addition, some objects can be hovered on but will not generate spikelines, such as scatter fills.

**Path**: layout.spikedistance

</details>

***

### Miscellaneous

<details>

<summary>Auto Type Numbers</summary>

**Default Value**: convert types

**Type**: enumerated

**Enum Options**: convert types,strict

**Documentation**: Using *strict* a numeric string in trace data is not converted to a number. Using *convert types* a numeric string in trace data may be treated as a number during automatic axis `type` detection. This is the default value; however it could be overridden for individual axes.

**Path**: layout.autotypenumbers

</details>

<details>

<summary>Plot Bg Color</summary>

**Default Value**: #fff

**Type**: color

**Documentation**: Sets the background color of the plotting area in-between x and y axes.

**Path**: layout.plot\_bgcolor

</details>

***

### Calendar Options

<details>

<summary>Calendar</summary>

**Default Value**: gregorian

**Type**: enumerated

**Enum Options**: chinese,coptic,discworld,ethiopian,gregorian,hebrew,islamic,jalali,julian,mayan,nanakshahi,nepali,persian,taiwan,thai,ummalqura

**Documentation**: Sets the default calendar system to use for interpreting and displaying dates throughout the plot.

**Path**: layout.calendar

</details>

***

### Hover Label Options

<details>

<summary>Align</summary>

**Default Value**: auto

**Type**: enumerated

**Enum Options**: left,right,auto

**Documentation**: Sets the horizontal alignment of the text content within hover label box. Has an effect only if the hover label text spans more two or more lines

**Path**: layout.hoverlabel.align

</details>

<details>

<summary>Bg Color</summary>

**Type**: color

**Documentation**: Sets the background color of all hover labels on graph

**Path**: layout.hoverlabel.bgcolor

</details>

<details>

<summary>Border Color</summary>

**Type**: color

**Documentation**: Sets the border color of all hover labels on graph.

**Path**: layout.hoverlabel.bordercolor

</details>

<details>

<summary>Size Size</summary>

**Default Value**: 13

**Type**: number

**Min**: 1

**Path**: layout.hoverlabel.font.size

</details>

<details>

<summary>Name Length</summary>

**Default Value**: 15

**Type**: integer

**Min**: -1

**Documentation**: Sets the default length (in number of characters) of the trace name in the hover labels for all traces. -1 shows the whole name regardless of length. 0-3 shows the first 0-3 characters, and an integer >3 will show the whole name if it is less than that many characters, but if it is longer, will truncate to `namelength - 3` characters and add an ellipsis.

**Path**: layout.hoverlabel.namelength

</details>

***

### Transition Options

<details>

<summary>Duration</summary>

**Default Value**: 500

**Type**: number

**Min**: 0

**Documentation**: The duration of the transition, in milliseconds. If equal to zero, updates are synchronous.

**Path**: layout.transition.duration

</details>

<details>

<summary>Easing</summary>

**Default Value**: cubic-in-out

**Type**: enumerated

**Enum Options**: linear,quad,cubic,sin,exp,circle,elastic,back,bounce,linear-in,quad-in,cubic-in,sin-in,exp-in,circle-in,elastic-in,back-in,bounce-in,linear-out,quad-out,cubic-out,sin-out,exp-out,circle-out,elastic-out,back-out,bounce-out,linear-in-out,quad-in-out,cubic-in-out,sin-in-out,exp-in-out,circle-in-out,elastic-in-out,back-in-out,bounce-in-out

**Documentation**: The easing function used for the transition

**Path**: layout.transition.easing

</details>

<details>

<summary>Ordering</summary>

**Default Value**: layout first

**Type**: enumerated

**Enum Options**: layout first,traces first

**Documentation**: Determines whether the figure's layout or traces smoothly transitions during updates that make both traces and layout change.

**Path**: layout.transition.ordering

</details>

***

### Basic Options (Plotter)

<details>

<summary>Auto Size</summary>

**Default Value**: false

**Type**: boolean

**Documentation**: Determines whether or not a layout width or height that has been left undefined by the user is initialized on each relayout. Note that, regardless of this attribute, an undefined layout width or height is always initialized on the first call to plot.

**Path**: layout.autosize

</details>

<details>

<summary>Color Way</summary>

**Default Value**: \[List]

**Type**: colorlist

**Documentation**: Sets the default trace colors.

**Path**: layout.colorway

</details>

<details>

<summary>Height</summary>

**Default Value**: 450

**Type**: number

**Min**: 10

**Documentation**: Sets the plot's height (in px).

**Path**: layout.height

</details>

<details>

<summary>Paper Bg Color</summary>

**Default Value**: #fff

**Type**: color

**Documentation**: Sets the background color of the paper where the graph is drawn.

**Path**: layout.paper\_bgcolor

</details>

<details>

<summary>Show Legend</summary>

**Type**: boolean

**Documentation**: Determines whether or not a legend is drawn. Default is `true` if there is a trace to show and any of these: a) Two or more traces would by default be shown in the legend. b) One pie trace is shown in the legend. c) One trace is explicitly given with `showlegend: true`.

**Path**: layout.showlegend

</details>

<details>

<summary>Template</summary>

**Type**: any

**Documentation**: Default attributes to be applied to the plot. Templates can be created from existing plots using `Plotly.makeTemplate`, or created manually. They should be objects with format: `{layout: layoutTemplate, data: {[type]: [traceTemplate, ...]}, ...}` `layoutTemplate` and `traceTemplate` are objects matching the attribute structure of `layout` and a data trace. Trace templates are applied cyclically to traces of each type. Container arrays (eg `annotations`) have special handling: An object ending in `defaults` (eg `annotationdefaults`) is applied to each array item. But if an item has a `templateitemname` key we look in the template array for an item with matching `name` and apply that instead. If no matching `name` is found we mark the item invisible. Any named template item not referenced is appended to the end of the array, so you can use this for a watermark annotation or a logo image, for example. To omit one of these items on the plot, make an item with matching `templateitemname` and `visible: false`.

**Path**: layout.template

</details>

<details>

<summary>Width</summary>

**Default Value**: 700

**Type**: number

**Min**: 10

**Documentation**: Sets the plot's width (in px).

**Path**: layout.width

</details>

***

### Chart Margins (Plotter)

<details>

<summary>Auto Expand</summary>

**Default Value**: true

**Type**: boolean

**Documentation**: Turns on/off margin expansion computations. Legends, colorbars, updatemenus, sliders, axis rangeselector and rangeslider are allowed to push the margins by defaults.

**Path**: layout.margin.autoexpand

</details>

<details>

<summary>B</summary>

**Default Value**: 80

**Type**: number

**Min**: 0

**Documentation**: Sets the bottom margin (in px).

**Path**: layout.margin.b

</details>

<details>

<summary>L</summary>

**Default Value**: 80

**Type**: number

**Min**: 0

**Documentation**: Sets the left margin (in px).

**Path**: layout.margin.l

</details>

<details>

<summary>Pad</summary>

**Default Value**: 0

**Type**: number

**Min**: 0

**Documentation**: Sets the amount of padding (in px) between the plotting area and the axis lines

**Path**: layout.margin.pad

</details>

<details>

<summary>R</summary>

**Default Value**: 80

**Type**: number

**Min**: 0

**Documentation**: Sets the right margin (in px).

**Path**: layout.margin.r

</details>

<details>

<summary>T</summary>

**Default Value**: 100

**Type**: number

**Min**: 0

**Documentation**: Sets the top margin (in px).

**Path**: layout.margin.t

</details>

***

### Multi Trace Options (Plotter)

<details>

<summary>Bar Gap</summary>

**Type**: number

**Min**: 0

**Max**: 1

**Documentation**: Sets the gap (in plot fraction) between bars of adjacent location coordinates.

**Path**: layout.bargap

</details>

<details>

<summary>Bar Group Gap</summary>

**Default Value**: 0

**Type**: number

**Min**: 0

**Max**: 1

**Documentation**: Sets the gap (in plot fraction) between bars of the same location coordinate.

**Path**: layout.bargroupgap

</details>

<details>

<summary>Bar Mode</summary>

**Default Value**: group

**Type**: enumerated

**Enum Options**: stack,group,overlay,relative

**Documentation**: Determines how bars at the same location coordinate are displayed on the graph. With *stack*, the bars are stacked on top of one another With *relative*, the bars are stacked on top of one another, with negative values below the axis, positive values above With *group*, the bars are plotted next to one another centered around the shared location. With *overlay*, the bars are plotted over one another, you might need to reduce *opacity* to see multiple bars.

**Path**: layout.barmode

</details>

<details>

<summary>Bar Norm</summary>

**Default Value**:

**Type**: enumerated

**Enum Options**: ,fraction,percent

**Documentation**: Sets the normalization for bar traces on the graph. With *fraction*, the value of each bar is divided by the sum of all values at that location coordinate. *percent* is the same but multiplied by 100 to show percentages.

**Path**: layout.barnorm

</details>