I am a big sucker for Charts and Graphs, and today I found one awesome library called Chart.js, which we will use with Python Flask Web Framework, to graph our data.
As Bitcoin is doing so well, I decided to graph the monthly Bitcoin price from January up until now.
Dependencies:
Install Flask:
1
|
|
Create the files and directories:
1 2 |
|
We need the Chart.js library, but I will use the CDN version, in my html.
Creating the Flask App:
Our data that we want to graph will be hard-coded in our application, but there are many ways to make this more dynamic, in your app.py
:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
|
Populating the HTML Static Content:
As we are using render_template
we need to populate our html files in our templates/
directory. As you can see we have 3 different html files:
templates/bar_chart.html
:
templates/line_chart.html
:
templates/pie_chart.html
:
Running our Application:
As you can see, we have 3 endpoints, each representing a different chart style:
- /line
- /bar
- /pie
Let’s start our flask application:
1
|
|
When we access our /line
endpoint:
When we access our /bar
endpoint:
When we access our /pie
endpoint: