Metrics / KPI Component

Hi all,

A simple component for those of us building dashboards with Streamlit, in case useful.

Installation

pip install streamlit-metrics

Usage

import streamlit as st
from streamlit_metrics import metric, metric_row

st.write("## Here's a single figure")
metric("Metric 0", 0)

st.write("## ... and here's a row of them")
metric_row(
    {
        "Metric 1": 100,
        "Metric 2": 200,
        "Metric 3": 300,
        "Metric 4": 400,
        "Metric 5": 500,
    }
)

Pull requests welcome at https://github.com/samdobson/streamlit-metrics

14 Likes

Nice! I love components like these @sjd333, things that are conceptually simple but wrap the functionality up into an easy-to-import function :+1:

1 Like

Hey @sjd333 welcome back

I love it, easy to use and stylish!
You should definitely post it inside the Components Tracker :slight_smile:

Cheers,
Fanilo

1 Like

Thanks @andfanilo and @randyzwitch. Couldn’t resist building something that leverages the new horizontal layout capabilities (Streamlit suddenly became even more powerful - love it!)

3 Likes

Love this, super useful and super clean, thanks for sharing this @sjd333 :heart:

1 Like

Hi, have you had success in using st.empty() to create a placeholder for a metric at top of page, where the actual metric will only be known, or updated, after call to function with values from say a text input further down the page? I’ve tried:

metric = st.empty()

then

metric.metric and metric.metric_row

but get the following error message:

metric() is not a valid Streamlit command.`

It could quite likely be some newbie error I’m making. Thanks for any guidance!

Doh, nevermind, as per the Streamlit documentation for using “with” notation with st.empty()

metrics = st.empty()
..
..

with metrics:
    metric('Results', len(df))