Plotly

Interactive charts, dashboards, and data visualization examples.

Setup & Installation

Installation & Basic Setup

# Install Plotly
pip install plotly

# Install additional packages
pip install pandas numpy dash

# Basic imports
import plotly.graph_objects as go
import plotly.express as px
import plotly.offline as pyo
import pandas as pd
import numpy as np

# For Jupyter notebooks
import plotly.io as pio
pio.renderers.default = "notebook"

# For web applications
import dash
from dash import dcc, html

Basic Charts

Line & Scatter Plots

import plotly.graph_objects as go
import plotly.express as px
import numpy as np

# Create sample data
x = np.linspace(0, 10, 100)
y1 = np.sin(x)
y2 = np.cos(x)

# Line plot with Plotly Express
fig = px.line(x=x, y=y1, title='Sine Wave')
fig.show()

# Multiple lines
fig = go.Figure()
fig.add_trace(go.Scatter(x=x, y=y1, mode='lines', name='sin(x)'))
fig.add_trace(go.Scatter(x=x, y=y2, mode='lines', name='cos(x)'))
fig.update_layout(title='Trigonometric Functions', xaxis_title='X', yaxis_title='Y')
fig.show()

# Scatter plot
x_scatter = np.random.randn(100)
y_scatter = np.random.randn(100)
fig = px.scatter(x=x_scatter, y=y_scatter, title='Random Scatter Plot')
fig.show()

# Scatter with colors
colors = np.random.randn(100)
fig = px.scatter(x=x_scatter, y=y_scatter, color=colors, 
                title='Colored Scatter Plot', color_continuous_scale='viridis')
fig.show()

Bar & Pie Charts

import plotly.graph_objects as go
import plotly.express as px
import pandas as pd

# Sample data
categories = ['A', 'B', 'C', 'D', 'E']
values = [23, 45, 56, 78, 32]

# Bar chart
fig = px.bar(x=categories, y=values, title='Bar Chart')
fig.show()

# Horizontal bar chart
fig = px.bar(x=values, y=categories, orientation='h', title='Horizontal Bar Chart')
fig.show()

# Grouped bar chart
df = pd.DataFrame({
    'Category': ['A', 'B', 'C', 'D', 'E'] * 2,
    'Value': [23, 45, 56, 78, 32, 34, 67, 23, 45, 67],
    'Group': ['Group 1'] * 5 + ['Group 2'] * 5
})

fig = px.bar(df, x='Category', y='Value', color='Group', 
            title='Grouped Bar Chart', barmode='group')
fig.show()

# Pie chart
fig = px.pie(values=values, names=categories, title='Pie Chart')
fig.show()

# Donut chart
fig = go.Figure(data=[go.Pie(labels=categories, values=values, hole=0.3)])
fig.update_layout(title='Donut Chart')
fig.show()

Advanced Charts

3D & Surface Plots

import plotly.graph_objects as go
import numpy as np

# 3D scatter plot
x = np.random.randn(100)
y = np.random.randn(100)
z = np.random.randn(100)

fig = go.Figure(data=[go.Scatter3d(
    x=x, y=y, z=z,
    mode='markers',
    marker=dict(
        size=5,
        color=z,
        colorscale='viridis',
        opacity=0.8
    )
)])
fig.update_layout(title='3D Scatter Plot')
fig.show()

# Surface plot
x = np.linspace(-5, 5, 50)
y = np.linspace(-5, 5, 50)
X, Y = np.meshgrid(x, y)
Z = np.sin(np.sqrt(X**2 + Y**2))

fig = go.Figure(data=[go.Surface(z=Z, x=X, y=Y)])
fig.update_layout(title='3D Surface Plot')
fig.show()

# 3D line plot
t = np.linspace(0, 10, 100)
x = np.sin(t)
y = np.cos(t)
z = t

fig = go.Figure(data=[go.Scatter3d(
    x=x, y=y, z=z,
    mode='lines',
    line=dict(color='red', width=5)
)])
fig.update_layout(title='3D Line Plot')
fig.show()

Heatmaps & Contour

import plotly.graph_objects as go
import plotly.express as px
import numpy as np
import pandas as pd

# Simple heatmap
data = np.random.randn(10, 10)
fig = go.Figure(data=go.Heatmap(z=data, colorscale='viridis'))
fig.update_layout(title='Heatmap')
fig.show()

# Correlation heatmap
np.random.seed(42)
df = pd.DataFrame(np.random.randn(100, 5), columns=['A', 'B', 'C', 'D', 'E'])
correlation_matrix = df.corr()

fig = go.Figure(data=go.Heatmap(
    z=correlation_matrix.values,
    x=correlation_matrix.columns,
    y=correlation_matrix.columns,
    colorscale='RdBu',
    zmid=0
))
fig.update_layout(title='Correlation Heatmap')
fig.show()

# Contour plot
x = np.linspace(-5, 5, 50)
y = np.linspace(-5, 5, 50)
X, Y = np.meshgrid(x, y)
Z = np.sin(np.sqrt(X**2 + Y**2))

fig = go.Figure(data=go.Contour(
    x=x, y=y, z=Z,
    colorscale='viridis',
    contours=dict(
        start=-1, end=1, size=0.1
    )
))
fig.update_layout(title='Contour Plot')
fig.show()

Dash Applications

Interactive Dashboards

import dash
from dash import dcc, html, Input, Output
import plotly.express as px
import pandas as pd
import numpy as np

# Create sample data
np.random.seed(42)
dates = pd.date_range('2020-01-01', '2023-12-31', freq='D')
data = pd.DataFrame({
    'date': dates,
    'value': np.cumsum(np.random.randn(len(dates)) * 0.1) + 100,
    'category': np.random.choice(['A', 'B', 'C'], len(dates))
})

# Initialize Dash app
app = dash.Dash(__name__)

# Define app layout
app.layout = html.Div([
    html.H1("Interactive Dashboard", style={'textAlign': 'center'}),
    
    html.Div([
        dcc.Dropdown(
            id='category-dropdown',
            options=[{'label': cat, 'value': cat} for cat in data['category'].unique()],
            value='A',
            style={'width': '50%'}
        )
    ], style={'padding': '20px'}),
    
    dcc.Graph(id='time-series-plot'),
    
    html.Div([
        dcc.Graph(id='histogram-plot')
    ], style={'display': 'flex'})
])

# Define callbacks
@app.callback(
    [Output('time-series-plot', 'figure'),
     Output('histogram-plot', 'figure')],
    [Input('category-dropdown', 'value')]
)
def update_plots(selected_category):
    # Filter data
    filtered_data = data[data['category'] == selected_category]
    
    # Time series plot
    fig1 = px.line(filtered_data, x='date', y='value', 
                  title=f'Time Series for Category {selected_category}')
    
    # Histogram
    fig2 = px.histogram(filtered_data, x='value', 
                       title=f'Distribution for Category {selected_category}')
    
    return fig1, fig2

# Run the app
if __name__ == '__main__':
    app.run_server(debug=True, port=8050)

# Simple dashboard with multiple charts
app2 = dash.Dash(__name__)

app2.layout = html.Div([
    html.H1("Multi-Chart Dashboard"),
    
    html.Div([
        dcc.Graph(
            id='scatter-plot',
            figure=px.scatter(data, x='date', y='value', color='category')
        )
    ]),
    
    html.Div([
        dcc.Graph(
            id='box-plot',
            figure=px.box(data, x='category', y='value')
        )
    ])
])

if __name__ == '__main__':
    app2.run_server(debug=True, port=8051)

Quick Reference

Key Modules:

• plotly.graph_objects - Low-level API
• plotly.express - High-level API
• plotly.offline - Offline plotting
• dash - Web applications
• plotly.io - I/O operations

Common Chart Types:

• px.line() - Line charts
• px.scatter() - Scatter plots
• px.bar() - Bar charts
• px.pie() - Pie charts
• go.Heatmap() - Heatmaps
• go.Surface() - 3D surfaces