Starting with Data

Actionable data analytics tips, tricks, and tutorials to increase your earning potential. Delivered right to your inbox every Saturday.

Insights at a Glance: The Step-by-Step Process to Create an Interactive Hospitality Manager Dashboard using Python and Dash

Data paralysis is a nightmare.

It leads to only two outcomes:

poor decision-making
missed opportunities

Instead, decision-makers need real insights at their fingertips. And you can help bring those insights to life by creating interactive dashboards.

Manual data crunching wastes valuable time.

There's a better way to handle complex data. Turning massive amounts of data into meaningful dashboards that are visually appealing and easy to use. The best part is that it can be done using free tools: Python and Dash. And you don't have to install anything, either.

Imagine what this means for you:

making fast decisions with real-time custom dashboards
keep up with the latest and greatest data management tools
reclaim your time and impress your coworkers (and your boss!)

By the way, if you haven't snagged your copy of The Data Analytics Portfolio Playbook, now's the time! Get up and running in two weeks or less. Data visualizations are awesome for your portfolio. The playbook includes everything you need to create an awesome portfolio -- including how to host for free.

Here's a specific example of what's possible when you follow the proven playbook.

Your step-by-step guide to getting it done

This tutorial walks you through creating an interactive dashboard with Python and Dash.

This kind of thing is PERFECT for a data analytics portfolio project. And it will work for any dataset or industry. Even yours. If you're using Excel for reports and dashboards today, give Python a chance.

Don't sleep on the power of automating your data analytics work!

Here's what we're building today (click here if you can't see the gif below)

Alright, let's create this thing.

Step 1: Set Up Your Environment

First, prepare your Google Colab environment by installing the necessary libraries.

Paste this code into a new Google Collab notebook cell and run it.

You can use my notebook to help you get started.

!pip install dash pandas plotly
import dash
import pandas as pd
import plotly.express as px
from dash import dcc, html, Input, Output
# Better image quality
%config InlineBackend.figure_formats = 'retina'

Step 2: Load and Inspect Data

Load your CSV file and get a feel for how it's built and what's inside.

By the way, we're using the Hospitality data set from the fantastic Real World, Fake Data project (thanks Mark!)

# Load the dataset
file_path = 'https://query.data.world/s/6whyevrn7zfjrm2rvvydbskslxexex?dws=00000'
data = pd.read_csv(file_path)
# Display the first few rows
print(data.head())

Step 3: Data Cleaning and Preparation

Before diving into Dash, let's clean and prepare the data for analysis.

Convert date columns from strings to datetime objects
Fill in missing values
Calculate new columns for "total guests" and "revenue"
Remove duplicate records
Filter data to only "Completed" reservations

Here's the code:

# Convert date columns to datetime and sort by date
data['check_in_date'] = pd.to_datetime(data['check_in_date'])
data['Date'] = pd.to_datetime(data['Date'])
data.sort_values('Date', inplace=True)
# Deal with missing entries and create new features
data.fillna({'special_requests_flag': 'No', 'advanced_booking': 'No'}, inplace=True)
data['total_guests'] = data['adults'] + data['children']
data['revenue'] = data['Avg Room Rate'] * data['stay_duration']
# Eliminate redundant records
data.drop_duplicates(inplace=True)
# Focus on 'Completed' reservations
data = data[data['reservation_status'] == 'Completed']

Step 4: Create Interactive Plots

Now that we have a good sense of the data let's use Plotly to create interactive visualizations of your data.

We're creating 4 charts for the dashboard:

Daily Revenue
Reservation Status
Booking Channel Usage
Guest Composition

These 4 charts will give managers quick insights into the most important parts of their business.

# Daily Revenue
daily_revenue = data.groupby('Date')['revenue'].sum().reset_index()
revenue_fig = px.line(daily_revenue, 
                      x='Date', 
                      y='revenue', 
                      title='Daily Revenue')
# Reservation Status Count
status_count_fig = px.bar(data, 
                          x='Date', 
                          y='reservation_id',
                          color='reservation_status', 
                          title='Daily Reservation Status Count')
# Booking Channel Usage
channel_fig = px.area(data, 
                      x='Date', 
                      y='reservation_id',
                      color='booking_channel', 
                      title='Daily Booking Channel Usage')
# Guest Composition
comp_fig = px.scatter(data, 
                      x='Date', 
                      y='total_guests', 
                      size='stay_duration', 
                      color='room_type', 
                      title='Daily Guest Composition')
# Customize the charts with a clean and professional look
for fig in [revenue_fig, status_count_fig, channel_fig, comp_fig]:
    fig.update_layout(plot_bgcolor='white', paper_bgcolor='white')
    fig.update_xaxes(title_standoff=25)
    fig.update_yaxes(title_standoff=25)

Step 5: Build Your Dashboard

Now that we have our charts and graphs (Plotly calls these 'figures'), let's assemble the pieces into an interactive dashboard using Dash.

This might seem like a lot of code, but a lot of it is styling so that our final product looks awesome.

Let's add one for each graph to update our dashboard based on the start and end date that the user chooses:

app = dash.Dash(__name__)
# Dashboard layout with custom styling
app.layout = html.Div([
    html.H1("Hospitality Management Dashboard", 
            style={'text-align': 'center', 'color': '#007BFF'}),
    html.Div([
        html.P("Select Date Range:"),
        dcc.DatePickerRange(
            id='date-picker-range',
            start_date=data['Date'].min(),
            end_date=data['Date'].max(),
            display_format='MMM D, YYYY',
            style={'margin-bottom': '20px'}
        ),
    ], style={'text-align': 'center'}),
    html.Div(dcc.Graph(id='revenue-graph'), style={'padding': '10px'}),
    html.Div(dcc.Graph(id='reservation-count-graph'), style={'padding': '10px'}),
    html.Div(dcc.Graph(id='channel-count-graph'), style={'padding': '10px'}),
    html.Div(dcc.Graph(id='guest-count-graph'), style={'padding': '10px'})
], style={'font-family': 'Arial, sans-serif', 'margin': '20px'})
# Callbacks to update graphs based on selected date range
@app.callback(
    [Output('revenue-graph', 'figure'),
     Output('reservation-count-graph', 'figure'),
     Output('channel-count-graph', 'figure'),
     Output('guest-count-graph', 'figure')],
    [Input('date-picker-range', 'start_date'),
     Input('date-picker-range', 'end_date')]
)
def update_graphs(start_date, end_date):
    # Filter data based on the date range
    filtered_data = data[(data['Date'] >= start_date) & (data['Date'] <= end_date)]
    # Daily Revenue
    revenue_fig = px.line(filtered_data.groupby('Date')['revenue'].sum().reset_index(),
                          x='Date', y='revenue', title='Daily Revenue')
    # Daily Room Type Reservation Counts
    reservation_count_data = filtered_data.groupby(['Date', 
                                                    'room_type']).size().reset_index(name='count')
    reservation_count_fig = px.bar(reservation_count_data, 
                                   x='Date', y='count', color='room_type',
                                   title='Daily Reservation Counts by Room Type', text='count')
    # Daily Booking Channel Counts
    channel_count_data = filtered_data.groupby(['Date', 
                                                'booking_channel']).size().reset_index(name='count')
    channel_count_fig = px.area(channel_count_data, 
                                x='Date', y='count', color='booking_channel',
                                title='Daily Booking Channel Counts')
    # Daily Property Guest Counts
    guest_count_data = filtered_data.groupby(['Date', 'Property']).sum().reset_index()
    guest_count_fig = px.bar(guest_count_data, x='Date', y='total_guests', color='Property',
                             title='Daily Guest Counts by Property', text='total_guests')
    # Customize the figures
    for fig in [revenue_fig, reservation_count_fig, channel_count_fig, guest_count_fig]:
        fig.update_layout(plot_bgcolor='white', paper_bgcolor='white')
        fig.update_xaxes(title_standoff=25)
        fig.update_yaxes(title_standoff=25)
    return revenue_fig, reservation_count_fig, channel_count_fig, guest_count_fig

Step 6: Launch and Share

Finally, let’s run our app! Add this at the end of your notebook:

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

Here's what you'll see in Google Colab: (click here if you can't see the gif below)

Looks great!

Try it on your own:

If you made it this far, congratulations! Share a copy with me via email or on x/Twitter.

Try different chart types
Use the same chart types but use different columns
Try it with a data set from your work or another project

Did this tutorial help? Hit reply and let me know or fill out this quick survey.

Until next time, keep exploring and happy visualizing!

Brian

Whenever you're ready, here's how I can help you:

Get more data analytics tips in my previous newsletter articles
Build your data analytics portfolio in 2 weeks with The Data Analytics Portfolio Playbook

You are receiving this because you signed up for Starting with Data, purchased one of my data analytics products, or enrolled in one of my data analytics courses. Unsubscribe at any time using the link below.

600 1st Ave, Ste 330 PMB 92768, Seattle, WA 98104-2246
Unsubscribe ﾷ Preferences

Starting With Data

🟢 Insights at a Glance: The Step-by-Step Process to Create an Interactive Hospitality Manager Dashboard using Python and Dash