Plotly

Plotly is a graphing library that can be used to create interactive graphs. Use the rx.plotly component to wrap Plotly as a component for use in your web page. Checkout Plotly for more information.

When integrating Plotly graphs into your UI code, note that the method for displaying the graph differs from a regular Python script. Instead of using fig.show(), use rx.plotly(data=fig) within your UI code to ensure the graph is properly rendered and displayed within the user interface

Basic Example

Let's create a line graph of life expectancy in Canada.

3D graphing example

Let's create a 3D surface plot of Mount Bruno. This is a slightly more complicated example, but it wraps in Reflex using the same method. In fact, you can wrap any figure using the same approach.

Plot as State Var

If the figure is set as a state var, it can be updated during run time.

Adding Styles and Layouts

Use update_layout() method to update the layout of your chart. Checkout Plotly Layouts for all layouts props.

API Reference

rx.plotly

Display a plotly graph.

Prop	Type \| Values	Default
`data`	`Figure`
`layout`	`dict`
`template`	`Template`
`config`	`dict`
`use_resize_handler`	`bool`	`LiteralVar.create(True)`

Event Triggers

See the full list of default event triggers

Trigger	Description
`on_click`	Fired when the plot is clicked.
`on_after_plot`	Fired after the plot is redrawn.
`on_animated`	Fired after the plot was animated.
`on_animating_frame`	Fired while animating a single frame (does not currently pass data through).
`on_animation_interrupted`	Fired when an animation is interrupted (to start a new animation for example).
`on_autosize`	Fired when the plot is responsively sized.
`on_before_hover`	Fired whenever mouse moves over a plot.
`on_button_clicked`	Fired when a plotly UI button is clicked.
`on_deselect`	Fired when a selection is cleared (via double click).
`on_hover`	Fired when a plot element is hovered over.
`on_relayout`	Fired after the plot is laid out (zoom, pan, etc).
`on_relayouting`	Fired while the plot is being laid out.
`on_restyle`	Fired after the plot style is changed.
`on_redraw`	Fired after the plot is redrawn.
`on_selected`	Fired after selecting plot elements.
`on_selecting`	Fired while dragging a selection.
`on_transitioning`	Fired while an animation is occurring.
`on_transition_interrupted`	Fired when a transition is stopped early.
`on_unhover`	Fired when a hovered element is no longer hovered.