Hello, in this video, we are going to
create a pie chart just like the one
you're looking at. So you can find this
from highcharts.com, go to Chart and
series types and go to Pie chart. This
one here shows the percentage of users
for the major internet browsers. So for
example, Chrome has the majority, you
see this big slice here, and each slice
is associated with a percentage. In our
case, what we're going to have is, we
did this analysis earlier. So we have
these data, for each course, we have a
number of rating left for that course.
Therefore, we're going to end up with
something like this. But interactive, as
you can see in here. Let's go and
prepare our environment. So I'm going to
create a new file ratings by course.
[No audio]
It's a pie.
[No audio]
And as usual, I'll
use this template, this JustPy
template, and then add
[No audio]
a HighCharts component which belong to wp and
e to the render this JavaScript
code, which we have to paste in here.
[No audio]
So inside here it goes the code of this chart.
So that one in there, Ctrl A, copy it,
and paste it there, and don't forget to
delete the semicolon, the parenthesis,
and on top here delete everything that
is before that curly brackets. I'd like
to try out the code before I make any
changes. I have this error here. There
are four quotes, I have to remove one,
and then run.
[No audio]
And so we get the pie charts visualized
correctly. Next, I want to get that code
[No audio]
paste it on top here, and also,
[No audio]
we want to have this aggregation of the DataFrame
where we are basically counting how many
ratings are for each course. So
Course Name, Rating, count that. Right,
then next we have to look at the
structure of the data. So as you can
see this is a big list
[No audio]
with dictionaries, so here is the first
dictionary, but be careful here.
[No audio]
From what I see what we have here is this
dictionary, which has this key and
value, this key and value, and then this
key and that value, which is a list. So
it ends in here. Therefore, this time,
what we need to do is
access hc.options.series.data.
So unlike the other times, when we did
hc.options.series
because the data were directly
[No audio]
after series, so series was the list.
But this time
[No audio]
series has a data key and
that data key contains the actual data,
which is made of dictionary. So the
first dictionary with name and y, the
second dictionary with name and y
again. The first dictionary also has
this other properties such as sliced
true and selected true, which
indicates that this chrome is sliced, you
see it's separated by the other slices
of the pie. So that's for Chrome. The
other ones don't have those properties,
which is fine. So I'm just going to
leave it like that. But every one of
them has a name and a y. Therefore, these
will be equal to something and that
something is something we need to
construct now. So hc_data will be that,
[No audio]
that's a list. It's a list of
dictionaries, right.
[No audio]
A list of dictionaries
which have a name equal to, let's find
a name for a variable v1, right. And then
[No audio]
so name and y, the label
of their other value is y. Let's
have a v2 variable. So since these
always change, Opera here, QQ here,
Sogou Explorer there. That means we need
a variable after the name and also a
variable after y. Since these values
are also changing. And what we're
doing is we are constructing a list
comprehension. So for v1 and v2 in,
so what do we get this? Basically, we
need, for v1, we need the names for
each course, the titles of the courses.
And for v2, we need the rate, the number
of ratings for the course. So let's
take a look at the DataFrame, how it
looks like, share. So I think the index
has the course name. Let me show
actually that to you, I'll execute that
cell and execute that as well. So we get
this but share.index is basically
a list like object which contains all the
names of the courses. And share, actually
list share
[No audio]
contains the number of
ratings. So what we're going to do is we
are doing for v1, v2 in zip share.index,
share, print v1, v2.
And what's happening here is that
in the first iteration, that is going to
print out v1, the title of the first
course, and the number of rating left
for that course. So v1, v2, then
v1, v2 again, and again, and
again. That's what we need here. So for
v1, v2 in zip, share, sorry, share.index,
and share. So those values are
going to be injected into here and here
in this dictionary, and then we assign
that to this, and then we stop the
script, and we run it again to see where we are.
[No audio]
So we get an error, attribute
list object has no attribute data. So
let's go, take a look at where the error
occurred, at line 84, which is here. And it
says list object has no attribute data,
which means that this is the list
object and this is the data attributes,
series that is a list. Of course it
doesn't have this data attribute because
we thought this was a dictionary,
somehow I thought, maybe you didn't. So
series, series is really a list, so
that was a logic mistake for my part.
But that is what errors are about. So
they explain to you what's going on, you
read that, and you fix the issue. So
since series is a list, it means it
has items, and in this case, it has only
one item. So it is the big dictionary,
which has this key and value, that's key
and value, and that's key and value. So
the series list has only one item,
therefore, we need to access that one
item from series. So the item with index
0, that then will give us this
dictionary, and out of that dictionary,
we extract the data key of that
dictionary. So by extracting data by
accessing the data key, we get the list
of the data key. So now we should be fine.
[No audio]
It looks good. And that ends this video
as well. And that was the series of graphs
that we developed throughout the
sections. I'd like to thank you for
following and I'll talk to you in the next
videos, see you.