How to Embed a Free Tableau in Streamlit Effortlessly
Tags: webdev, programming, tutorial, python
Published: 2023-07-01 06:10:35


Join us on an exciting journey as we delve into the incredible capabilities of Streamlit and Pygwalker in analyzing and visualizing data effortlessly. Get ready to immerse yourself in the world of interactive data exploration!

## What is Streamlit?

Streamlit is a powerful Python library that simplifies the process of transforming your data scripts into interactive web applications. With Streamlit, you can bid farewell to the complexities of web development and coding challenges. It's a fast, open-source, and free solution for building and sharing data applications.

## What is Pygwalker?

On the other hand, Pygwalker is a highly popular Python library specifically designed for data analysis and visualization. It provides data scientists and analysts with an intuitive interface for generating captivating visualizations, such as scatter plots, line plots, bar charts, and histograms. The best part? You don't need any coding skills to use Pygwalker!

To learn more about Pygwalker and access additional examples and resources, visit the official [Pygwalker GitHub Page](https://github.com/Kanaries/pygwalker).

## Getting Started with Streamlit and Pygwalker

Before we embark on our data exploration journey, let's make sure your computer is equipped with a Python environment (version 3.6 or higher). Once you have that set up, follow these steps:

### Installing Dependencies

Open your command prompt or terminal and run the following commands to install the necessary dependencies:

```shell
pip install pandas
pip install pygwalker
pip install streamlit
```

### Incorporating Pygwalker in a Streamlit Application

Now that we have all the dependencies installed, let's create a Streamlit application that incorporates Pygwalker. Create a new Python script called `pygwalker_demo.py` and add the following code:

```python
import pygwalker as pyg
import pandas as pd
import streamlit.components.v1 as components
import streamlit as st

# Configure the Streamlit page
st.set_page_config(
    page_title="Using Pygwalker with Streamlit",
    layout="wide"
)

# Add a title
st.title("Using Pygwalker with Streamlit")

# Import your data
df = pd.read_csv("https://sample.csv")

# Generate the HTML using Pygwalker
pyg_html = pyg.walk(df, return_html=True)

# Embed the generated HTML into the Streamlit app
components.html(pyg_html, height=1000, scrolling=True)
```

![Embedding Pygwalker in a Streamlit Application](https://raw.githubusercontent.com/org-ssh-2/images/main/streamlit-1.jpeg)

### Exploring Data with Pygwalker in Streamlit

To launch the [Streamlit application](https://matts-organization-3.gitbook.io/streamlit-pygwalker/) and start exploring your data, run the following command in your command prompt or terminal:

```shell
streamlit run pygwalker_demo.py
```

You will see some information displayed on the terminal. Access the Streamlit app in your browser using the provided URL:

Local URL: [http://localhost:8501](http://localhost:8501)

Network URL: [http://xxx.xxx.xxx.xxx:8501](http://xxx.xxx.xxx.xxx:8501)

Open the provided URL ([http://localhost:8501](http://localhost:8501)) in your web browser and witness the power of Pygwalker's intuitive drag-and-drop actions for interactive data exploration and visualization.

### Saving the State of a Pygwalker Chart

If you wish to save the state of a Pygwalker chart, follow these simple steps:

1. Click the export button on the chart.

![Exporting Pygwalker Charts in Streamlit](https://raw.githubusercontent.com/org-ssh-2/images/main/streamlit-2.jpeg)

2. Click the copy code button.

![Copying Code with Pygwalker in Streamlit](https://raw.githubusercontent.com/org-ssh-2/images/main/streamlit-3.jpeg)

3. Paste the copied code into your Python script where needed.

```python
import pygwalker as pyg
import pandas as pd
import streamlit.components.v1 as components
import streamlit as st

# Configure the Streamlit page
st.set_page_config(
    page_title="Using Pygwalker with Streamlit",
    layout="wide"
)

# Add a title
st.title("Using Pygwalker with Streamlit")

# Import your data
df = pd.read_csv("https://kanaries-app.s3.ap-northeast-1.amazonaws.com/public-datasets/bike_sharing_dc.csv")

# Paste the copied Pygwalker chart code here
vis_spec = """<PASTE_COPIED_CODE_HERE>"""

# Generate the HTML using Pygwalker
pyg_html = pyg.walk(df, spec=vis_spec, return_html=True)

# Embed the generated HTML into the Streamlit app
components.html(pyg_html, height=1000, scrolling=True)
```

Don't forget to refresh the webpage to see the saved state of your Pygwalker chart.

It's worth noting that Pygwalker is built upon [graphic-walker](https://github.com/Kanaries/graphic-walker), a powerful library that can be embedded in various platforms, including Excel and Airtable. This means that your Pygwalker app can easily collaborate with users in different environments, leveraging the capabilities of graphic-walker and Pygwalker.

## Conclusion

Streamlit and Pygwalker are invaluable tools that simplify data exploration and facilitate effective communication of insights. With Streamlit's user-friendly interface and Pygwalker's interactive visualization options, you can seamlessly enhance your data analysis workflow. So go ahead, dive into your data, and share your remarkable insights with the world!

## References

- [Pygwalker GitHub Repository](https://github.com/Kanaries/pygwalker)
- [Pygwalker in Streamlit Demo](https://github.com/Kanaries/pygwalker-in-streamlit)

For more in-depth information, you can refer to this Doc to learn how to use [Streamlit](https://docs.kanaries.net/pygwalker/use-pygwalker-with-streamlit.en) with PyGWalker.