How to Create a Beautiful Python Visualization Dashboard With Panel/Hvplot

hey friends welcome back to my channel if you're new here my name is tufu i'm a data science consultant working here in the netherlands in today's video i'll teach you how to create an interactive visualization dashboard in python an interactive dashboard is a great way to share insights from the data and the results of your data science project of course you can also create dashboards in bi2 such as tableau or power bi but using python we have the flexibility to create a lot of different types of visualization and we can also customize our visualization however we want for this visualization project we'll be using a data set from our world in data website about the world's carbon dioxide emissions over the history if you want to customize this project to make it your own portfolio project please feel free to pick another data set that you are interested in so before we start let's take a look at some popular visualization platforms and libraries in r and python this graph shows a different dashboarding tools and their popularity over time over the past few years dash and streamlet have gained a lot more popularity as dashboarding solutions in bison however x2 has their own pros and cons and so it's important for us to know when to use which if you're working with duped the notebooks for your project foiler and panel are the two libraries that support working with tube the notebooks which means you can turn your notebook into a dashboard meanwhile dash streamlet and flask do not support this in addition each of them is suitable or optimal for a certain use case but i won't go deeper into the comparison in this video for now i have two options namely boiler and panel as i'm planning to work with two with the notebooks i found out that voila is actually not very flexible in terms of how you can customize and design the looks of your dashboard so for this reason i'm gonna go for panel so what the heck is pano pano is an open source python library that lets you create custom interactive web apps and dashboards by connecting user-defined widgets to plots images tables or text panel is developed by anaconda i mean the anaconda company not the anaconda it's one of the seven packages in the whole of this ecosystem here's a simplified overview of how these seven packages work together to help turn a panda's data frame into a visualization dashboard okay that's a lot of information if you're still hanging there let's now really get our hands dirty and get started with our project first of all let's create a project photo called co2 dashboard and then go into this folder now we want to create a virtual environment for our project this will create an isolated environment for our python project so that this project can have its own dependencies and packages regardless of whatever dependencies every other project has this step is crucial to make our visualization work properly because i've encountered some really strange issues with the visualization in jupiter lab if we don't do this if you're on windows you need to use another comment for this but i'll put it somewhere on the screen for you we'll be working with two libraries namely h3plot and panel let's install svplot and also to be the lab for our project for panel we need to install it in the base environment instead of the virtual environment because otherwise i found out that the plot would not be interactive in jupiter lab it's kind of strange and i still don't understand exactly why but anyway let's go out of our virtual environment and install panel now let's go back again into our virtual environment and launch the jupiter lab now we want to create a new notebook and import the necessary libraries namely pandas numpy panel and an extension called tabulator for creating interactive tables and lastly we import the hp plot.pandas which allows us to create interactive dataframes more on that in a second now let's read in the dataset that we want to use as you can see for x country in the world and for each year in the history we have the data for each measure of co2 emissions if we print out all the columns we can see that we have data on co2 amounts co2 per capita co2 from different sources such as coal oil and gas we also have other information such as gdp and population of the countries please note that the country column here also includes continents and the world as a whole for example we can filter this data for the world or europe or north america looking at this data set we can brainstorm on what kind of visualization we want to build in our dashboard and how exactly we want our dashboard to look like i want our dashboard to have a header a sidebar with some text and the overall settings and control widgets then in the main body of the dashboard we can have a few different visualizations first of all we can visualize the co2 emission over time by continent next to this visualization we can add a table to show the exact amount of co2 per continent just for further information for the next graph it could be interesting to plot the co2 emissions against the gdp per capita so each country will be a dot on this scatter plot we want to see if co2 emissions are associated with higher or lower gdp or if there's no correlation at all in the last visual what shall we do i don't have idea but okay maybe we can plot the amount of co2 emissions from different sources such as coal oil or gas per continent so we can have a comparison of which continent produces the most of a certain source of co2 for over the graphs we can have an overarching interactive control for this data set as we have many different years i think it makes sense to have a slider here for the year going back to our notebook i'm a bit short in time for filming today so i'll walk you through the goat and not do the full life coding anyway first of all we'll do some pre-processing to replace the na values with zeros and we also create a new column for gdp per capita by dividing the gdp by the population we have to be a bit careful here with dividing by zero values now we need to make our data frame interactive by calling this interactive method on our data frame you'll see in a bit what we can do with it please bear with me next we want to create a few widgets for our visualizations the widgets are the interactive elements on our dashboard like sliders radio buttons or drop-down menus that users can use to configure our visualization if you go to the panel's documentation page you can see a lot of different types of widgets you can create for example slider radio button and also how exactly to create them so here we go i have checked for the mean and the max value of the year in our data set so i have put them here next we want to create a radial button widget for the different measures of co2 which is the y-axis of our first chart in this case i'm interested in co2 and co2 per capita so i include them here now we need to connect the data pipeline with the widget so that every time the widgets change the underlying data for our visualization is also updated so here i just select only the years that are before the year value in the slider and then we aggregate the data by country and u column so here's what the data pipeline looks like now let's move on to create the chart using this data pipeline it's very simple just one line of gold and you can see that our chart is interactive and if we move the slider the year is now also moving now let's move on to the table which use the same underlying data only that we want to present the data in the table format and for this we can use the type later extension that we have imported and you can see that the table also has exactly the same widgets and the table is also interactive for the co2 and gdp scatter plot we want to create a different pipeline because now we want to filter the data set based on the exact year on the year slider and also we want to select only the countries and not the continents and again the scatter plot is also very simple to create with hp plot so here we have the x-axis being gdp per capita and the y-axis being the co2 and if we move the slider the scatter plot is also updated for the last visualization which is the co2 sources by continent i create a new radio button widget for different sources of co2 core co2 oil co2 and gas co2 now in a very similar manner as for the previous charts we create data pipeline and connect it to the widgets and then we can use hp plot to plot the data and now we can select different co2 sources and see which continent produces the most of them so now that we have created all the visualizations that we need the last step would be to create a dashboard which is simply to put all the visualizations together on one page luckily pano has a lot of dashboarding templates that allow us to put very easily all the visualizations together i'll choose the fast list template and we can define here the title the sidebar which is the left panel on the dashboard we can add here the text or the images in markdown formats and we also want to include our year slider on this sidebar next we'll define the main body of the dashboard so the whole concept is very similar to how we design websites so everything can be put in rows and columns as our dashboard has two rows i have two rows here so the first row has two columns one for the line chart and the other one is for the table now for the line chart i also want to include the the widget which belongs to this graph so that's why i include this widget here in this column and the right hand side column is just a table so it's just this for the second row we also have very similar structure we have two columns and the first column is the scatter plot and the second column is the bar chart with its own widgets now after we define the template we just need to make it serveable now i can actually serve this dashboard by going to the terminal and using the command panel serve so yes this is our dashboard it doesn't look bad right and you can move the slider and click on things to play with it i'll post all the code to my github and also share it with you in the description below so you can take a look at it in more detail and also use it for your own project if you get any value from this video please smash the like button to support my channel for more portfolio projects like this check out my portfolio project playlist on my channel thank you for watching bye [Music]

Channel: Thu Vu data analytics

Views: 531,991

Keywords: data analytics, data science, python, data, tableau, bi, programming, technology, coding, data visualization, python tutorial, data analyst, data scientist, data analysis, power bi, python data anlysis, data nerd, big data, learn to code, business intelligence, how to use r, r data analysis, vscode, Data portfolio, How to data portfolio

Id: uhxiXOTKzfs

Length: 10min 56sec (656 seconds)

Published: Thu Mar 10 2022