Plotly Dash essentials

Some useful links for Dash app development

Development

Plotly graphs

Plotly fundamentals

Plotly express, plotly express API

Basic charts

Plotly maps

Scatter Plots on Mapbox

Styling graphs, styling templates

Plotly colorscales

Plotly. Discrete colors

Dash

Plotly graphs in Dash example

Dash data table (Python callbacks)

Dash layout

Dash HTML components

Dash Core components

Dash sharing data between callbacks

Code snippets

Plotly express styling defaults

px.defaults.template = "seaborn"
px.defaults.defaults.width = 600
px.defaults.height = 400

Plotly figures customisation

fig.update_xaxes(type="category")  # set x axes to show discrete values (e.g. years as numbers, not floats)
fig.update_traces(line_color="#26c6da")  # change graph line colors
fig.update_traces(textinfo="percent+label")  # e.g. for pie-chart to show percentage and label value (45% NSW)
fig.update_layout(showlegend=False)  # remove legend
fig.update_layout(xaxis=dict(
                  tickmode="array",
                  tickvals=[i for i in range(0, 24)],
                  ticktext=[str(i) + (":00") for i in range(0, 24)],))  # format x axis labels to display time in 24-h range
fig.update_layout(transition_duration=500)  # for smooth animation
fig.update_layout(title={"y": 0.9, "x": 0.5, "xanchor": "center", "yanchor": "top"})  # center title

Deployment

App structure

Project must have (for gunicorn deployment):

• app.py with server = app.server
• requirements.txt (pip freeze, don’t forget to include gunicorn)
• Procfile web: gunicorn app:server where app is app.py, server is server var in app.py

Other links

Pandas quick reference

Big Data workflow with Pandas and Plotly v.3

Plotly Dash Flask tutorial

How to embed a Dash app into an existing Flask app