Plot (Plotly)

#| standalone: true
#| components: [viewer]
#| viewerHeight: 500

import plotly.express as px
from palmerpenguins import load_penguins
from shiny import App, ui
from shinywidgets import output_widget, render_widget  

penguins = load_penguins()

app_ui = ui.page_fluid(
    ui.input_slider("n", "Number of bins", 1, 100, 20),
    output_widget("plot"),  
)

def server(input, output, session):
    @render_widget  
    def plot():  
        scatterplot = px.histogram(
            data_frame=penguins,
            x="body_mass_g",
            nbins=input.n(),
        ).update_layout(
            title={"text": "Penguin Mass", "x": 0.5},
            yaxis_title="Count",
            xaxis_title="Body Mass (g)",
        )

        return scatterplot  

app = App(app_ui, server)
import plotly.express as px
from palmerpenguins import load_penguins
from shiny import App, ui
from shinywidgets import output_widget, render_widget  

penguins = load_penguins()

app_ui = ui.page_fluid(
    ui.input_slider("n", "Number of bins", 1, 100, 20),
    output_widget("plot"),  
)

def server(input, output, session):
    @render_widget  
    def plot():  
        scatterplot = px.histogram(
            data_frame=penguins,
            x="body_mass_g",
            nbins=input.n(),
        ).update_layout(
            title={"text": "Penguin Mass", "x": 0.5},
            yaxis_title="Count",
            xaxis_title="Body Mass (g)",
        )

        return scatterplot  

app = App(app_ui, server)
import plotly.express as px
from palmerpenguins import load_penguins
from shiny.express import input, ui
from shinywidgets import render_widget  

penguins = load_penguins()

ui.input_slider("n", "Number of bins", 1, 100, 20)

@render_widget  
def plot():  
    scatterplot = px.histogram(
        data_frame=penguins,
        x="body_mass_g",
        nbins=input.n(),
    ).update_layout(
        title={"text": "Penguin Mass", "x": 0.5},
        yaxis_title="Count",
        xaxis_title="Body Mass (g)",
    )

    return scatterplot  
No matching items

Relevant Functions

No matching items

Details

Plotly is an interactive graphics plotting library.

To make an interactive plot with Plotly in Shiny for Python, we will need to use the shinywidgets library to connect Shiny with ipywidgets.

To make a plotly figure, we need to do the following steps:

  1. Import the output_widget() and render_widget() functions from the shinywidgets library, from shinywidgets import output_widget, render_widget

  2. Call output_widget() to the UI of your app to create a div in which to display the figure. Where you call this function will determine where the figure will appear within the layout of the app. The id parameter you provide will be used to link to other parts of the Shiny app.

  3. Define a function within the server() function that creates the figure.

    • The name of the function should be the same value you passed into the id parameter in your output_widget() function call in the UI.

    • If your function calls reactive values, Shiny will update your figure whenever those values change, in a reactive fashion.

  4. Decorate your plotting function with a @render_widget() decorator.

    • If your plotting function is not the same as the id you used in the ui.output_widget(), you can add an additional @output(id=...) decorator.
    • If you use the @output() decorator, make sure it is above the @render_widget() decorator.

Visit shiny.posit.co/py/docs/ipywidgets.html to learn more about using ipywidgets with Shiny.