×

Displaying Text, Pandas Dataframe, Table and JSON in Streamlit

Table Json Dataframe Streamlit Feature

When we are presenting the data or model to someone it is desirable to have sections, titles, header, subheaders, tables, etc to present data in a neat manner. Tables and DataFrame can be rendered with the help of additional packages like Pandas.

Streamlit offers a complete range of inbuilt classes and HTML-like functions to render text in a beautiful way quickly. There are various methods to display dataframes as well.

You may also choose to display data in JSON format or code in a particular language as well.

Basic Text Display Functions

The different functions are for rendering text in different sizes. You can also display alerts like success, warning, info, error, exception.

import streamlit as st

def main():

	#title 
	st.title("Hello! This is a streamlit tutorial")
	
	#variable
	name = 'Amit'
	
	#text
	st.text("My name is {}".format(name))
	
	#header
	st.header("This is header")
	
	#subheader
	st.subheader("This is subheader")
	
	#markdown
	st.markdown("## This is markdown") 

if __name__ == '__main__':
	main()
Text Functions Streamlit
# Displaying coloured text / Bootstrap Alert

	st.success("Successful")
	st.warning("Warning") 
	st.info("Some info")
	st.error("Error")
	st.exception("This is an exception")
	pass
Bootstrap Alerts Streamlit

st.write() Superfunction

st.write() is Streamlit’s one of the most versatile functions. You can pass almost anything to st.write(): text, data, Matplotlib figures, Altair charts, and more. Don’t worry, Streamlit will figure it out and render things the right way.

import streamlit as st

def main():
	
	st.write("This is a normal text")
	st.write("### This is markdown text with 3 hash (#) symbol")
	st.write(3+2)
	pass 

if __name__ == '__main__':
	main()

Within inverted commas (” “), the text would be displayed normally inside the st.write() function. However with respective markdown symbols, like ‘###’ here for h3 size, the text would be displayed accordingly. Also, any arithmetic operation simply delivers the final result.

In a nutshell, st.write() will simply evaluate and display any function, text, or operation within it.

Superfunction Write Streamlit

Displaying Tables and DataFrames

Method 1: Using DataFrames

Call a dynamic table using st.dataframe()

import streamlit as st
import pandas as pd

df = pd.read_csv("iris.csv")

#Method 1
st.dataframe(df)
Dataframe Streamlit

You can scroll to view data in other rows and columns here and it is therefore dynamic in nature. You can also specify the height and width of the frame if you like

st.dataframe(df, 300, 300)
Dataframe Height Width Changed

You may also choose to add an additional function to display more information in the dataframe. For example, you can highlight the maximum value in each column using:-

st.dataframe(df.style.highlight_max(axis=0))

In the image below, the maximum value is highlighted in each column. The dataset is large so you can’t view the highlighted text in other columns here.

Max Value Dataframe

Method 2: Using Table

Call a static table using,

st.table(df)

st.table() displays a static table and doesn’t show on a separate small window but all the results are on the main window.

Static Table Dataframe

Method 3: Using st.write()

You can also use the superfunction st.write() to display tabular data

st.write(df.head())
Df Head Using Write Streamlit

Displaying JSON

You can display an object or string as a pretty-printed JSON string using the inbuilt function streamlit.json({body})

st.json({'data 1' : 'name 1', 'data 2' : 'name 2'})
Streamlit Print Json

Displaying Code

You can display code and select the language as well using streamlit.code("""code""")

##Display code

mycode = """
def sayhello():
	print("Hello Streamlit lovers")
"""

st.code(mycode,language='python')
Streamlit Display Code