liveBook · Manning

Chapter 7: The CEO strikes back: Supercharging the dashboard

What you will learn in chapter 7 of Build Python Web Apps with Streamlit

This chapter introduces an iterative upgrade of the Note n’ Nib metrics dashboard in response to user feedback, using advanced Streamlit features to improve flexibility and usability.

After this chapter you will be able to

What it builds on

Section by section

Introduction

This chapter introduces an iterative upgrade of the Note n’ Nib metrics dashboard in response to user feedback, using advanced Streamlit features to improve flexibility and usability.

Key terms: user feedback, targeted improvements, iterating on the app, quality and satisfaction, advanced Streamlit visualizations, modal dialogs, query parameters, deeplinks, usability, GitHub repository

7.1 Feedback on the dashboard

This section sets up the CEO’s consolidated feedback as the motivation for enhancing the previously built sales dashboard and recommends using the complete GitHub code as a reference.

Key terms: consolidated feedback, wishlist, dashboard, final state, GitHub repo, complete code

7.2 Granularity in the time series chart

This section identifies why day-level time-series charts become unreadable over long date ranges and proposes letting users choose an appropriate time granularity.

Key terms: daily granularity, time series chart, markers, date range, granularity

7.2.1 Enabling different time granularities

This subsection prepares dashboard data for weekly, monthly, and yearly aggregation and replaces hardcoded daily logic with a configurable time-grain parameter.

Key terms: prep_data, pandas dataframe, Day, Week, Month, Year, get_metric_time_series, data_wrangling.py, time_series_chart.py, grain

7.2.2 Creating a time grain selector

This section adds an ordered time-grain selector to the dashboard’s time series chart so users can choose Day, Week, Month, or Year.

Key terms: st.select_slider, st.selectbox, st.slider, time grain, time_series_chart, grain_options, grain, get_time_series_chart, Day

7.3 Interdependent filters

This section makes dashboard filters interdependent by deriving each filter’s options from data already narrowed by earlier selections.

Key terms: interdependent filters, filter bar, Category, Segment, Product name, effective_df, get_unique_values, apply_filters, filter fields, unique values

7.4 Date range comparisons

This section establishes that dashboard metrics need comparison to past periods for meaningful context and introduces adding date-range comparisons to the dashboard.

Key terms: metric, contextualizing data, comparable period, date range comparison, date range comparisons, metric bar, date range selector

7.4.1 Adding another date range selector

This section adds a selectable comparison date range to the dashboard and calculates comparison dates for common reporting periods.

Key terms: MoM, QoQ, YoY, Previous period, main date range, comparison date range, get_compare_range, offsets, pandas DateOffset, compare_start

7.4.2 Showing the comparison in the metric bar

This subsection adds comparison-period percentage changes to the dashboard’s metric bar while preserving the user’s other filters.

Key terms: compare_df, main_df, get_filtered_data_within_date_range, get_metric, comparison date range, get_delta, get_formatted_delta, format_metric, percentage delta, st.metric

7.5 A drilldown view

This section motivates adding a detailed drilldown view for power users who need to investigate the individual data behind dashboard aggregates.

Key terms: drilldown view, source data, metrics bar, aggregate numbers, power user, visualizations, drill down, new view, existing features

7.5.1 Inserting a modal dialog

This section adds an unobtrusive drilldown trigger that opens main and comparison data in a Streamlit modal dialog while using a container placeholder to control sidebar display order.

Key terms: modal dialog, drilldown view, overlay, st.dialog, decorator, drilldown, main_df, compare_df, st.dataframe, st.container

7.5.2 Designing the content of the drilldown

This section derives a flexible pivot-table-like drilldown design from CEO feedback so users can inspect aggregated metrics across any chosen combination of dimensions.

Key terms: drilldown view, main_df, compare_df, dimensions, aggregate numbers, pivot table, Drilldown Fields, multi-select, Main tab, Comparison tab

7.5.3 Implementing the drilldown view

This section implements a configurable drilldown dialog that aggregates dashboard metrics by chosen dimensions, adds and styles a total row, and explains why dialog interactions rerun independently of the main app.

Key terms: st.multiselect, drilldown dimensions, get_metric_cols, get_aggregate_metrics, grouped.apply, pandas Series, drilldown, get_drilldown_table, main_data, compare_data

7.6 Enabling deeplinks

This section motivates dashboard deeplinks as shareable URLs that preserve a user's selected dashboard state for collaborative viewing.

Key terms: deeplinking, dashboard state, collaboration tax, URL, embedded information, inputs, q=streamlit, user inputs, app's URL, repopulate inputs

7.6.1 Using st.query_params

This section explains how to use URL query parameters through st.query_params so a dashboard URL reflects and can restore a user’s widget selections.

Key terms: query string, query parameters, key-value pairs, st.query_params, st.session_state, pie_chart_dimension, deeplinks, widget values, default behavior, start_date

7.6.2 Setting widget defaults through st.session_state

This subsection explains how a keyed Streamlit widget can receive a programmatically set default through st.session_state, provided the value is assigned before the widget renders.

Key terms: key, st.session_state, widget, select_dim

7.6.3 Implementing deeplinks

This section implements shareable dashboard deeplinks by synchronizing selected widget state with URL query parameters and restoring correctly typed values from those URLs.

Key terms: st.query_params, st.session_state, get_param, set_widget_defaults, set_params, from_dict, w:, widget key, query parameters, st.set_page_config

7.7 Sourcing data from a data warehouse

This section motivates replacing the dashboard’s static CSV source with a Google BigQuery data-warehouse table for practical large-scale data handling.

Key terms: static CSV file, data ingestion, data warehouse, structured data, filtering, aggregations, joins, Google BigQuery, table, CSV file

7.7.1 Getting data into BigQuery

This section introduces BigQuery and walks through creating a dataset and uploading the dashboard CSV data as an auto-detected table.

Key terms: Google BigQuery, Google Cloud Platform (GCP), data warehouse, Structured Query Language (SQL), GCP account, GCP project, project ID, BigQuery, Explorer, dataset

7.7.2 Setting up the Python-BigQuery connection

This section prepares a Streamlit app to authenticate to BigQuery by enabling required APIs, creating a read-only service account and key, and converting its JSON credentials into Streamlit secrets.

Key terms: BigQuery API, BigQuery Storage API, GCP project, Pandas dataframe, GCP service account, IAM & Admin, Service Accounts, Viewer, authentication, service account key

7.7.3 Updating the dashboard to load data from BigQuery

This section replaces the dashboard’s CSV-based loader with a BigQuery-backed load_data function while preserving the rest of the modular app.

Key terms: BigQuery API, BigQuery Storage API, db-dtypes, pandas dataframe, load_data, st.secrets, service_account_info, BigQuery client, BigQuery Storage API client, DATASET

7.7.4 Notes on deployment to Streamlit Community Cloud

This subsection explains the Community Cloud deployment considerations for the upgraded dashboard, depending on whether it uses a checked-in CSV file or BigQuery.

Key terms: static CSV approach, BigQuery, Git, GitHub repository, Streamlit Community Cloud, GCP credentials, requirements.txt, pip freeze, modules, specific versions

7.8 Summary

This summary recaps how user feedback led to dashboard improvements in interaction, comparison, drilldown, sharing, and scalable data access.

Where this is used later

Concepts explained in this chapter

← Chapter 6: A dashboard fit for a CEO Chapter 8: Building a CRUD app with Streamlit →

These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.