How to display charts using VegaLite library in Streamlit

In this recipe, we will learn how to display charts using VegaLite library in Streamlit. We will also take a look at a simple Streamlit application example.

Recipe Objective: How to display charts using Vega-Lite library in Streamlit?

Similar to ggplot2, Vega-Lite is a visualisation package that implements a grammar of graphics. In Streamlit, you can display charts using this library with the help of "st.vega_lite_chart".

 Syntax: st.vega_lite_chart(data=None, spec=None, use_container_width=False, **kwargs)
 Parameters:
   data -> Either the data to be plotted or a Vega-Lite spec containing the data
   spec -> The Vega-Lite specifications for the chart. This must be set to None if the spec was previously passed in the preceding argument.
   use_container_width -> If this is set as true, it sets the chart width to the column width. It takes precedence over the Vega-Lite's native width value.
   **kwargs -> They are similar as spec, but as keywords.

Code:

#importing required libraries
import streamlit as st
import pandas as pd
import numpy as np

#creating a sample dataframe
df = pd.DataFrame(np.random.randn(100, 3),columns=['a', 'b', 'c'])

#plotting the chart
st.vega_lite_chart(df, {'mark': {'type': 'circle', 'tooltip': True},
'encoding': {'x': {'field': 'a', 'type': 'quantitative'},
'y': {'field': 'b', 'type': 'quantitative'},
'size': {'field': 'c', 'type': 'quantitative'},
'color': {'field': 'c', 'type': 'quantitative'},
}})

To run the app, either create an appname.py file with the above code using any text editor, or if you are using a jupyter notebook, you need to download your .ipynb notebook as a Python (.py) file and run the same using the "streamlit run appname.py" command. Once you run the command, the app will automatically open in your default browser.

What Users are saying..

profile image

Gautam Vermani

Data Consultant at Confidential
linkedin profile url

Having worked in the field of Data Science, I wanted to explore how I can implement projects in other domains, So I thought of connecting with ProjectPro. A project that helped me absorb this topic... Read More

Relevant Projects

Deep Learning Project for Time Series Forecasting in Python
Deep Learning for Time Series Forecasting in Python -A Hands-On Approach to Build Deep Learning Models (MLP, CNN, LSTM, and a Hybrid Model CNN-LSTM) on Time Series Data.

Detectron2 Object Detection and Segmentation Example Python
Object Detection using Detectron2 - Build a Dectectron2 model to detect the zones and inhibitions in antibiogram images.

Build an End-to-End AWS SageMaker Classification Model
MLOps on AWS SageMaker -Learn to Build an End-to-End Classification Model on SageMaker to predict a patient’s cause of death.

BERT Text Classification using DistilBERT and ALBERT Models
This Project Explains how to perform Text Classification using ALBERT and DistilBERT

Build an AI Chatbot from Scratch using Keras Sequential Model
In this NLP Project, you will learn how to build an AI Chatbot from Scratch using Keras Sequential Model.

Time Series Classification Project for Elevator Failure Prediction
In this Time Series Project, you will predict the failure of elevators using IoT sensor data as a time series classification machine learning problem.

Build Regression (Linear,Ridge,Lasso) Models in NumPy Python
In this machine learning regression project, you will learn to build NumPy Regression Models (Linear Regression, Ridge Regression, Lasso Regression) from Scratch.

Time Series Analysis with Facebook Prophet Python and Cesium
Time Series Analysis Project - Use the Facebook Prophet and Cesium Open Source Library for Time Series Forecasting in Python

Deploy Transformer BART Model for Text summarization on GCP
Learn to Deploy a Machine Learning Model for the Abstractive Text Summarization on Google Cloud Platform (GCP)

Build a Hybrid Recommender System in Python using LightFM
In this Recommender System project, you will build a hybrid recommender system in Python using LightFM .