Pandas is a data analysis tool that is built on top of Python. It is open source and one of the mostly used library for data analysis. In this post we are going to learn about passing DataFrame to web page.

Installing Pandas

Before we use Pandas we need to install it. We use the pip command to install the Pandas library. Run this command to upgrade your pip tool:

Then run the following command to install Pandas:

Passing DataFrame to Web Page

Passing List Data to html Page

Let’s first start by displaying Python list to a web page.

Now let’s start by creating a demo.py file in our working folder. Open the file then enter the following code:

Let’s create templates folder in our working folder. Inside the templates folder create a file and save it as index.html. Paste the following code:

Run the demo.py script by running

command. If you go to 127.0.0.1/ in your browser you will see the data from list as shown below.

passing list to web page - Passing Data to HTML Page

Passing DataFrame Data to HTML Page

Let’s add another function in our demo.py file. Let’s call it data_analysis()

In the templates folder let’s create a file called data_analysis.html and add the content below.

Now let’s run our demo.py script. You should be able to see this on your web page when you visit 127.0.0.1:5000

passing DataFrame to web page - Passing Data to HTML Page

DataFrame to Web Page

Let’s add another function to our demo.py 

In our templates folder let’s add another file called data_frame_analysis.html. Add this code to the file.

When you run the demo.py script and go to 127.0.0.1:5000/data_frame_analysis you will be able to see the following web page:

passing data frame analysis to web page - Passing Data to HTML Page

Passing DataFrame Data From CSV File to HTML Page

Let’s create a DataFrame from a csv file then pass the DataFrame data to the HTML web page. We will use the titanic train data sets which you can download from here  titanic train data set (138 downloads) and drop it in your working directory.

Add this function to your demo.py file

In your templates folder create a file called external_data_frame_analysis.html then add the following code:

When you run the demo.py script you should be able to see this web page when you browse http://127.0.0.1:5000/external_data_frame_analysis. In our DataFrame we are only displaying 5 rows using the head(5) command.

passing csv DataFrame to web page - Passing Data to HTML Page

Complete Code

Here is the complete source code for this application

demo.py

index.html

data_analysis.html

data_frame_analysis.html

external_data_analysis.html

Conclusion

Passing Pandas DataFrame and Series data to the web page in Flask is pretty easy.In this post we have seen how we can pass data from Flask code to the HTML web page. Before you can analyze data with Pandas you need to install it.

What’s Next

In this post we have learned hot to pass Pandas DataFrame to HTML web page. In the next post we are going to learn how to pass plots to web page in Flask.

Passing DataFrame to Web Page

Post navigation