Ailurophile
Ailurophile

Reputation: 3005

Is there a way to add/display bloxs in streamlit?

Bloxs is a simple python package that helps you display information in an attractive way (formed in blocks). Perfect for building dashboards, reports and apps in the notebook.

It works with: Jupyter Notebook, Google Colab, Deepnote, Kaggle Notebook

B([
    B(1999, "Percent change!", percent_change=10),
    B("🎉🎉🎉", "Works with emojis"),
    B("68%", "Loading progress", progress=68),
    B(1234, "Bloxs in notebook!")
])

enter image description here

How to use the bloxes in streamlit?

I have tried with st.pyplot, and with streamlit HTML component but not able to add in streamlit app.

Is there a way to add these bloxs in Streamlit?

Upvotes: 0

Views: 323

Answers (1)

furas
furas

Reputation: 142992

Use B(...)._repr_html_() to get it as HTML and put it in streamlit using HTML component.

But HTML component can't detect its height and you have to set it manually.

import streamlit as st
import streamlit.components.v1 as components
from bloxs import B

st.title('Bloxs example in Streamlit')

item = B([
    B(1999, "Percent change!", percent_change=10),
    B("🎉🎉🎉", "Works with emojis"),
    B("68%", "Loading progress", progress=68),
    B(1234, "Bloxs in notebook!")
])._repr_html_()

components.html(item, height=300) #, scrolling=True)

enter image description here

Upvotes: 1

Related Questions