Skip to main content

Creating a data dashboard with Plotly and Dash (introduction)

Static Matplotlib exports remain essential, yet modern teams crave interactive filters baked into URLs they can bookmark. **Seaborn Part 3** stopped at scripted figures—Dash composes layouts of Plotly graphs with callbacks reacting to sliders, dropdowns, and buttons.

Install:

pip install dash plotly pandas

📚 Prerequisites​

  • Comfortable with functions and dictionaries.
  • Pandas Series/DataFrame slicing.

🎯 What you'll master​

  • Sketch the separation between Dash layout, callbacks, and Plotly traces.
  • Run a trivial dev server verifying hot reload ergonomics.

Minimal Dash skeleton​

from dash import Dash, dcc, html, Input, Output

app = Dash(__name__)

app.layout = html.Div(
    [
        html.H2("Rolling total"),
        dcc.Slider(min=2018, max=2024, step=1, value=2024, id="year"),
        dcc.Graph(id="revenue-chart"),
    ]
)


@app.callback(
    Output("revenue-chart", "figure"),
    Input("year", "value"),
)
def refresh(year):
    return {
        "data": [{"x": [1, 2, 3], "y": [year % 100, year % 73, year % 50], "type": "bar"}],
        "layout": {"title": f"Sample metrics — {year}"},
    }


if __name__ == "__main__":
    app.run(debug=True)

Callbacks are pure-ish: derive figure dicts from inputs; avoid caching global singletons unintentionally across users if you eventually host multi-tenant apps.

Production cautions beyond this intro​

  • Authentication, database connection pooling, and horizontal scaling deserve platform-specific chapters—treat Dash as glue, not infra.
  • For static sites, Plotly graphs can export JSON without Dash entirely.

💡 Key takeaways​

  • Dashboards trade simplicity for responsiveness—know which KPIs merit live wiring vs. nightly PDFs.

➡️ Next steps​

Shift from dashboards to scripted reliability with Introduction to automation with Python.