1
00:00:00,000 --> 00:00:02,904
Hi, welcome back. In this video, we are

2
00:00:02,910 --> 00:00:05,130
going to create an average rating by

3
00:00:05,130 --> 00:00:07,650
month by course graph. As you may know,

4
00:00:07,650 --> 00:00:10,170
we created that graph already but

5
00:00:10,170 --> 00:00:12,900
using Jupyter and matplotlib. So it

6
00:00:12,900 --> 00:00:15,780
look like this. The idea is that we're

7
00:00:15,780 --> 00:00:17,640
going to have the Month in the

8
00:00:17,640 --> 00:00:20,730
horizontal axis, and Average Ratings on

9
00:00:20,730 --> 00:00:22,620
the vertical axis, and we're going to

10
00:00:22,620 --> 00:00:24,960
have multiple graphs in that plot area,

11
00:00:25,560 --> 00:00:28,755
each representing a course in our dataset.

12
00:00:28,779 --> 00:00:30,810
And as you may know already, a

13
00:00:30,810 --> 00:00:34,230
good way to create graphs using JustPy

14
00:00:34,230 --> 00:00:37,014
and Highcharts is to go to the

15
00:00:37,220 --> 00:00:40,080
highcharts.com website, so you go under

16
00:00:40,080 --> 00:00:42,390
Charts and series types, and we find a

17
00:00:42,390 --> 00:00:44,220
graph that would be a good

18
00:00:44,220 --> 00:00:47,220
representative of our data. So I took a

19
00:00:47,220 --> 00:00:49,980
look in these examples, and I found that

20
00:00:50,546 --> 00:00:53,576
I would like to use Areaspline chart,

21
00:00:53,610 --> 00:00:55,860
which looks like this. You see that this

22
00:00:55,860 --> 00:00:58,410
has multiple lines, so 2 in this case,

23
00:00:58,650 --> 00:01:01,770
and it has this x axis with categorical

24
00:01:01,770 --> 00:01:03,930
data. So it's not numbers, it's Monday,

25
00:01:03,930 --> 00:01:05,880
Tuesday, Wednesday, and so on, and we

26
00:01:05,880 --> 00:01:09,540
have this number y axis, so Fruits

27
00:01:09,540 --> 00:01:12,030
units, and it represents the average

28
00:01:12,030 --> 00:01:15,030
fruit consumption during one week for

29
00:01:15,030 --> 00:01:18,870
John and Jane. In our case, we are going

30
00:01:18,870 --> 00:01:21,870
to change this graph and have six or

31
00:01:21,870 --> 00:01:24,060
seven lines, I'm not sure how many

32
00:01:24,090 --> 00:01:27,780
courses there are. So one line for each

33
00:01:27,810 --> 00:01:30,780
course showing the average ratings a

34
00:01:30,780 --> 00:01:33,780
long time, so over the months. So before

35
00:01:33,780 --> 00:01:36,090
we copy the code, let's first prepare

36
00:01:36,090 --> 00:01:38,700
the environment. So create the script

37
00:01:38,700 --> 00:01:41,460
and create the JustPy app, and so on.

38
00:01:42,240 --> 00:01:47,711
So I'm going to name this 4-average-rating,

39
00:01:47,787 --> 00:01:51,188
this will be, let's say, course-month,

40
00:01:51,362 --> 00:01:53,525
so average rating by course by

41
00:01:53,550 --> 00:01:56,670
month, '.py'. You see that is

42
00:01:56,670 --> 00:01:58,410
different from average-rating-month,

43
00:01:58,440 --> 00:02:00,150
this is average rating by course by

44
00:02:00,150 --> 00:02:02,850
month. Right? Now I'm going to copy this

45
00:02:03,305 --> 00:02:07,138
template of JustPy, copy there.

46
00:02:07,162 --> 00:02:09,445
[No audio]

47
00:02:09,470 --> 00:02:13,440
hc will be the HighCharts component, which

48
00:02:13,440 --> 00:02:17,610
belongs to wp and options is going to be

49
00:02:17,610 --> 00:02:22,590
as usually chart_definition, which has

50
00:02:22,590 --> 00:02:24,546
to be a variable somewhere here

51
00:02:24,570 --> 00:02:27,141
[No audio]

52
00:02:27,166 --> 00:02:31,121
is equal to a string, a multi-line string.

53
00:02:31,145 --> 00:02:33,386
[No audio]

54
00:02:33,411 --> 00:02:36,025
So let us copy that JavaScript code.

55
00:02:36,049 --> 00:02:39,118
[No audio]

56
00:02:39,143 --> 00:02:41,820
So this one in here, I'm going to copy all of that,

57
00:02:42,870 --> 00:02:45,660
paste it in there, and then just before

58
00:02:45,660 --> 00:02:48,210
chart, we leave that curly bracket

59
00:02:48,210 --> 00:02:51,030
before chart here, we leave that, and

60
00:02:51,060 --> 00:02:53,910
delete the semicolon, and the

61
00:02:53,910 --> 00:02:57,570
parenthesis. And now we are ready to

62
00:02:57,570 --> 00:03:00,598
replace these data with our data.

63
00:03:00,720 --> 00:03:03,030
But what I suggest you do first is to

64
00:03:03,030 --> 00:03:06,030
try out this example to see if this is

65
00:03:06,030 --> 00:03:09,060
working right now, without changing the

66
00:03:09,060 --> 00:03:11,550
data with your own data. So what I would

67
00:03:11,550 --> 00:03:13,955
like to do now is try to run this

68
00:03:13,979 --> 00:03:16,005
[No audio]

69
00:03:16,030 --> 00:03:18,570
and then visit the URL, and you're going to

70
00:03:18,570 --> 00:03:22,230
see an error. So JSONDecodeError

71
00:03:22,230 --> 00:03:24,660
Unknown identifier Highcharts. This

72
00:03:24,660 --> 00:03:28,920
happens because of this line. Python

73
00:03:28,920 --> 00:03:31,050
cannot recognize this expression here

74
00:03:31,050 --> 00:03:33,450
because this is JavaScript. So you want

75
00:03:33,450 --> 00:03:36,060
to delete that and only leave this

76
00:03:36,090 --> 00:03:38,280
string here, the color of background

77
00:03:38,280 --> 00:03:42,540
color, and now, if I stop the script,

78
00:03:43,020 --> 00:03:47,340
and run again, and reload the page, we

79
00:03:47,340 --> 00:03:49,650
should see the example just like we got

80
00:03:49,650 --> 00:03:52,500
it from the Highcharts website. Now

81
00:03:52,500 --> 00:03:55,860
these two graphs are areasplines. But

82
00:03:55,860 --> 00:03:57,660
if you want to change them to spline,

83
00:03:57,810 --> 00:04:00,000
you want to go over to your code and

84
00:04:00,030 --> 00:04:05,310
change that areaspline to spline, stop

85
00:04:05,343 --> 00:04:07,209
the script, run again,

86
00:04:07,233 --> 00:04:10,729
[No audio]

87
00:04:10,760 --> 00:04:11,917
and reload,

88
00:04:12,515 --> 00:04:16,895
and this is the output. Now we are

89
00:04:16,920 --> 00:04:20,160
ready to inject our own data into these

90
00:04:20,190 --> 00:04:23,010
data. So for that we want to go over to

91
00:04:23,010 --> 00:04:25,500
Jupyter where we have our analysis

92
00:04:25,500 --> 00:04:29,215
ready, copy that code,

93
00:04:29,240 --> 00:04:31,240
[No audio]

94
00:04:31,271 --> 00:04:32,280
paste it there,

95
00:04:33,090 --> 00:04:35,430
and we also need to do the aggregations

96
00:04:35,700 --> 00:04:38,730
necessary for extracting the month, the

97
00:04:38,730 --> 00:04:41,130
courses by month, so which is this code

98
00:04:41,130 --> 00:04:44,727
here, and that gives us this DataFrame.

99
00:04:46,314 --> 00:04:48,240
Now let's refresh our memory how the

100
00:04:48,240 --> 00:04:50,520
DataFrame looked like. So you can

101
00:04:50,550 --> 00:04:52,388
either print them in here

102
00:04:52,412 --> 00:04:55,605
[No audio]

103
00:04:55,630 --> 00:04:58,320
and execute the scripts, reload the page and see

104
00:04:58,320 --> 00:05:00,300
what you got printed out in the

105
00:05:00,330 --> 00:05:03,150
terminal, or you can see the outputs

106
00:05:04,110 --> 00:05:06,840
from Jupyter. So whatever you prefer,

107
00:05:06,960 --> 00:05:09,570
I'm just going to execute the script here.

108
00:05:09,595 --> 00:05:15,455
[No audio]

109
00:05:15,480 --> 00:05:18,450
And so we get the DataFrame printed out, even

110
00:05:18,450 --> 00:05:23,220
before we load the web app because

111
00:05:23,250 --> 00:05:25,950
it printed out because the web app is

112
00:05:25,950 --> 00:05:27,900
inside of functions. So this is just in

113
00:05:27,900 --> 00:05:29,730
the global namespace, in the global

114
00:05:29,730 --> 00:05:32,130
scope. So when the script is executed,

115
00:05:32,460 --> 00:05:35,910
these are executed. If this was inside

116
00:05:35,910 --> 00:05:38,550
the function here, it would only be

117
00:05:38,550 --> 00:05:41,850
executed when we load the page, and

118
00:05:41,850 --> 00:05:44,640
here, this is the DataFrame, so it has

119
00:05:44,640 --> 00:05:48,540
this Month index, and it has different

120
00:05:48,540 --> 00:05:51,630
columns. So this is the first column, then

121
00:05:51,630 --> 00:05:53,370
we have more columns, which we don't see

122
00:05:53,370 --> 00:05:55,440
in here, and then the last column is

123
00:05:55,470 --> 00:05:58,470
this, and the values of each column, so

124
00:05:58,470 --> 00:06:01,320
the name of a column, the values of that

125
00:06:01,320 --> 00:06:04,500
column, which have the average ratings, and

126
00:06:04,500 --> 00:06:06,840
we have one month for each row. So this

127
00:06:06,840 --> 00:06:11,610
is July of 2019, August 2019,

128
00:06:11,634 --> 00:06:13,634
[No audio]

129
00:06:13,659 --> 00:06:15,860
and January 2020, and so on.

130
00:06:17,486 --> 00:06:22,320
So index columns. Let's see now,

131
00:06:22,345 --> 00:06:26,173
[No audio]

132
00:06:26,198 --> 00:06:28,680
how do we inject

133
00:06:28,680 --> 00:06:31,055
those data into these data?

134
00:06:31,079 --> 00:06:33,704
[No audio]

135
00:06:33,729 --> 00:06:39,721
So we see that xAxis has this categories

136
00:06:40,823 --> 00:06:45,660
with these weekdays, so we can do the same

137
00:06:45,660 --> 00:06:48,150
thing now. Down here, we

138
00:06:48,150 --> 00:06:54,390
say hc.options.xAxis, so

139
00:06:54,420 --> 00:06:55,725
xAxis is the

140
00:06:55,749 --> 00:06:57,907
[No audio]

141
00:06:57,932 --> 00:06:59,910
key of the main

142
00:06:59,935 --> 00:07:02,545
dictionary, so it's directly exposed in the

143
00:07:02,730 --> 00:07:06,630
first level, so chart, title, legend,

144
00:07:06,840 --> 00:07:09,000
Axis, and then we have the second level,

145
00:07:09,030 --> 00:07:11,400
so categories is part of Axis, therefore

146
00:07:11,425 --> 00:07:17,095
we can access it, like so. So categories

147
00:07:17,130 --> 00:07:20,430
is a list, as you can see here,

148
00:07:20,730 --> 00:07:23,580
therefore, we need to replace it with a

149
00:07:23,580 --> 00:07:28,830
list, list month_average_crs, so that

150
00:07:28,860 --> 00:07:33,990
is our DataFrame, '.index'. So

151
00:07:33,990 --> 00:07:38,413
that column in there, 2018-05, 2018-06,

152
00:07:38,438 --> 00:07:40,920
and so on, right. That was the

153
00:07:40,920 --> 00:07:45,030
easy part. Now comes the data. So, what

154
00:07:45,030 --> 00:07:47,220
you need to do is you need to understand

155
00:07:47,280 --> 00:07:49,620
the structure of the data that is the

156
00:07:49,620 --> 00:07:54,870
very important first step. And so series is

157
00:07:56,070 --> 00:07:59,100
a first level key, therefore, we can

158
00:07:59,151 --> 00:08:02,331
say, hc.options.series,

159
00:08:03,210 --> 00:08:07,110
right. So this will give us that list.

160
00:08:08,735 --> 00:08:13,205
Then that list has, how many items does

161
00:08:13,230 --> 00:08:16,170
it have? So I see a dictionary, from

162
00:08:16,170 --> 00:08:18,480
there, upto here, that's a dictionary

163
00:08:18,480 --> 00:08:22,560
that has this name, John, pair of key

164
00:08:22,560 --> 00:08:25,290
and values name is the key, John is

165
00:08:25,290 --> 00:08:27,510
value, then we have this other key data,

166
00:08:27,990 --> 00:08:32,970
and a list and the dictionary ends there, and

167
00:08:32,970 --> 00:08:36,450
then we have the other dictionary. So

168
00:08:36,450 --> 00:08:39,210
it's Jane now, and these are the data

169
00:08:39,210 --> 00:08:42,660
for Jane. So the list is made of

170
00:08:42,660 --> 00:08:44,430
dictionary, and each dictionary

171
00:08:44,430 --> 00:08:49,380
represents a line in that chart. So

172
00:08:49,380 --> 00:08:52,470
that's for Jane, and that's for John.

173
00:08:54,060 --> 00:08:56,370
Therefore, what we need to do is we need

174
00:08:56,405 --> 00:08:59,735
to have here, so that would be the name

175
00:08:59,760 --> 00:09:03,521
of a course. Let's say the first course would be

176
00:09:03,545 --> 00:09:06,349
[No audio]

177
00:09:06,374 --> 00:09:08,490
100 Python Exercises 1 and

178
00:09:08,490 --> 00:09:13,170
so on, the entire title, and then data

179
00:09:13,170 --> 00:09:16,380
would contain a list of average ratings

180
00:09:16,380 --> 00:09:18,300
for that particular course. So that

181
00:09:18,300 --> 00:09:22,115
one, that one, that one, and so on.

182
00:09:22,268 --> 00:09:24,090
And then we would have to repeat

183
00:09:24,090 --> 00:09:27,810
that process for each of the six or seven

184
00:09:27,810 --> 00:09:30,960
courses that we have here. How do we do

185
00:09:30,960 --> 00:09:33,270
that? Well, you could do that manually,

186
00:09:33,270 --> 00:09:37,710
like maybe you could inject. So from

187
00:09:37,735 --> 00:09:39,255
series, you would say

188
00:09:39,279 --> 00:09:41,361
[No audio]

189
00:09:41,386 --> 00:09:42,728
the first plot,

190
00:09:42,870 --> 00:09:45,300
so that would give you the first

191
00:09:45,300 --> 00:09:48,870
dictionary, that expression is the first

192
00:09:48,870 --> 00:09:52,110
dictionary and then we could access name

193
00:09:52,140 --> 00:09:55,936
and replace that to maybe the

194
00:09:56,216 --> 00:10:01,140
month_average_crs.columns. So that would

195
00:10:01,140 --> 00:10:03,510
be the first column, and so on, that

196
00:10:03,540 --> 00:10:06,510
would be okay. But it's not an automatic

197
00:10:06,510 --> 00:10:09,210
process. So when you do manual work,

198
00:10:09,210 --> 00:10:11,280
that is a sign that you're not doing

199
00:10:11,280 --> 00:10:13,890
programming the right way, what we need

200
00:10:13,890 --> 00:10:17,310
to do instead is we need to create this

201
00:10:17,340 --> 00:10:21,870
entire list dynamically. And this is a very,

202
00:10:21,870 --> 00:10:24,300
very crucial point now in using

203
00:10:24,660 --> 00:10:28,710
Highcharts, but also in knowing how to

204
00:10:28,710 --> 00:10:32,070
manipulate data structures in Python. So

205
00:10:32,070 --> 00:10:33,840
this is an excellent practice, I'm

206
00:10:33,840 --> 00:10:36,570
very glad this came out such a

207
00:10:36,570 --> 00:10:39,270
great practice for you. So let me show

208
00:10:39,270 --> 00:10:41,880
you how you can construct this list out

209
00:10:41,880 --> 00:10:45,390
of this DataFrame. And so before we do

210
00:10:45,390 --> 00:10:49,170
that, before we assigned the list, we

211
00:10:49,170 --> 00:10:51,720
want to construct the list. So let's

212
00:10:51,750 --> 00:10:57,965
name this hc_data, and that is

213
00:10:57,990 --> 00:11:03,000
equal to, so we need to create a list. So

214
00:11:03,030 --> 00:11:06,360
that is a list. Therefore, we write

215
00:11:07,592 --> 00:11:11,762
square brackets. The list is made of

216
00:11:11,790 --> 00:11:14,550
dictionaries, therefore, we'll write

217
00:11:14,880 --> 00:11:18,060
curly brackets, and then inside each

218
00:11:18,060 --> 00:11:21,810
dictionary, we have a name key, we

219
00:11:21,840 --> 00:11:25,860
always have that name key, and a

220
00:11:25,860 --> 00:11:29,430
variable for that name key. Why I'm

221
00:11:29,430 --> 00:11:32,400
saying variable? Well, because name is

222
00:11:32,430 --> 00:11:34,860
always name, so it's a constant. That's

223
00:11:34,860 --> 00:11:38,100
why I'm hard coding that. So we should

224
00:11:38,100 --> 00:11:40,830
always have name there, but the value of

225
00:11:40,830 --> 00:11:44,550
name is a variable, so it's changing

226
00:11:44,580 --> 00:11:48,780
every time. And then what else, we

227
00:11:48,780 --> 00:11:51,690
have that pair, okay, inside the

228
00:11:51,690 --> 00:11:54,090
dictionary, that dictionary, so that

229
00:11:54,120 --> 00:11:56,880
dictionary has another pair, so data

230
00:11:57,120 --> 00:12:00,480
and the list. So let's write that a

231
00:12:00,480 --> 00:12:07,200
comma, data, the string, a colon, and

232
00:12:07,260 --> 00:12:11,454
we have a list. That list is basically

233
00:12:11,527 --> 00:12:14,610
representative of each of the plots, each

234
00:12:14,610 --> 00:12:16,170
of the seven plots that we are going to

235
00:12:16,170 --> 00:12:19,260
have for each course. So which means

236
00:12:19,260 --> 00:12:22,050
that list is going to be these ratings.

237
00:12:22,470 --> 00:12:24,630
For example, we're going to have the

238
00:12:24,630 --> 00:12:28,080
first list being the first column, for

239
00:12:28,080 --> 00:12:31,440
example, for 100 Python Exercises 1

240
00:12:31,470 --> 00:12:34,320
for that course, this column as a list

241
00:12:34,350 --> 00:12:36,270
in there, and then the other column

242
00:12:36,270 --> 00:12:38,730
after that course, the next and the next

243
00:12:38,730 --> 00:12:42,780
and the next. So one column for each

244
00:12:42,810 --> 00:12:45,780
course, and v1 is going to be

245
00:12:45,780 --> 00:12:49,800
replaced by the title of the column. So

246
00:12:49,800 --> 00:12:52,830
before I write the expression inside

247
00:12:52,830 --> 00:12:55,350
this list, I want to finish first, the

248
00:12:55,350 --> 00:12:58,020
upper level list comprehension because

249
00:12:58,020 --> 00:12:59,610
we have two list comprehensions here,

250
00:12:59,790 --> 00:13:01,860
we have the first level one, so let's

251
00:13:01,860 --> 00:13:04,440
call it the upper level. Here we are

252
00:13:04,440 --> 00:13:06,673
constructing dictionaries

253
00:13:06,698 --> 00:13:10,830
so its a list made of dictionaries, so

254
00:13:10,830 --> 00:13:15,255
that means we should say, here, for

255
00:13:15,284 --> 00:13:22,255
v1 in month_average_crs.columns.

256
00:13:23,258 --> 00:13:26,730
So what that is, is a list

257
00:13:26,755 --> 00:13:30,475
containing seven strings, one string

258
00:13:31,110 --> 00:13:33,930
for each course title. So it's going to

259
00:13:33,930 --> 00:13:36,180
be a list containing a 100 Python

260
00:13:36,180 --> 00:13:38,430
Exercises 1 Evaluate and Improve Your

261
00:13:38,430 --> 00:13:40,860
Skills, then the other title of the

262
00:13:40,860 --> 00:13:42,840
other course, and so on, it's a list of

263
00:13:42,900 --> 00:13:46,380
these titles. So what we're doing is we

264
00:13:46,440 --> 00:13:50,280
are injecting here, a title, the first

265
00:13:50,280 --> 00:13:52,590
title of that list in the first

266
00:13:52,590 --> 00:13:55,290
iteration, then the next title of that

267
00:13:55,320 --> 00:13:57,690
month_average_crs.columns lists in the

268
00:13:57,690 --> 00:14:00,090
next iteration, and so on. We're going to

269
00:14:00,090 --> 00:14:02,310
have like seven iterations or six,

270
00:14:02,310 --> 00:14:05,010
whatever is the number of courses that

271
00:14:05,010 --> 00:14:09,030
we have, right. But then inside here, we

272
00:14:09,030 --> 00:14:12,780
have a nested iteration, a nested list

273
00:14:12,780 --> 00:14:15,120
comprehension, sorry, which is this one

274
00:14:15,120 --> 00:14:19,530
here, and that will be again, let's

275
00:14:19,586 --> 00:14:23,426
write another variable, such as v2,

276
00:14:23,670 --> 00:14:25,521
for v2

277
00:14:25,665 --> 00:14:29,880
in month_average_crs,

278
00:14:29,957 --> 00:14:34,487
hmm, so what is this going to be? Well,

279
00:14:34,530 --> 00:14:38,670
it has to be this column, right? So

280
00:14:38,670 --> 00:14:40,530
which one is this column?

281
00:14:40,565 --> 00:14:42,785
What's the name of this column? Well,

282
00:14:42,810 --> 00:14:45,390
for this course is that is the name of

283
00:14:45,390 --> 00:14:48,360
the column. So here we need to write

284
00:14:48,810 --> 00:14:51,270
down the name of the column. You see

285
00:14:51,690 --> 00:14:55,830
this is a Pandas syntax. So you write

286
00:14:55,890 --> 00:14:57,900
the name of the column but we have

287
00:14:57,960 --> 00:15:00,660
different column names. So what's we

288
00:15:00,845 --> 00:15:07,235
enter here then is v1, because v1

289
00:15:07,260 --> 00:15:11,460
is going to be the current title in the

290
00:15:11,460 --> 00:15:14,280
upper level list comprehension. So

291
00:15:14,280 --> 00:15:16,980
basically what Python will do is, while

292
00:15:16,980 --> 00:15:21,210
it is iterating, the first title, it's

293
00:15:21,210 --> 00:15:23,640
going to stop in that upper level, first

294
00:15:23,665 --> 00:15:26,575
iteration, and it's going to iterate

295
00:15:26,645 --> 00:15:28,805
through that particular column, through

296
00:15:28,830 --> 00:15:33,128
these ratings for 100 Python Exercises 1,

297
00:15:33,443 --> 00:15:35,225
and it will construct that list.

298
00:15:35,250 --> 00:15:39,390
Once it finishes with all these numbers,

299
00:15:40,025 --> 00:15:44,255
it constructs that list, then it goes to

300
00:15:44,280 --> 00:15:47,610
the other, to the second iteration in

301
00:15:47,610 --> 00:15:49,800
the first level iteration. So in the

302
00:15:49,800 --> 00:15:52,590
second iteration of the other columns,

303
00:15:52,590 --> 00:15:54,330
which is going to be the next course,

304
00:15:54,942 --> 00:16:00,012
and so on. I hope it's clear. Right, so

305
00:16:01,200 --> 00:16:04,350
what's left to do is, we need to assign

306
00:16:04,380 --> 00:16:07,200
these new list so to inject it to our

307
00:16:07,200 --> 00:16:08,940
data, because we created it, but we

308
00:16:08,940 --> 00:16:13,020
haven't connected it to hc. So it

309
00:16:13,020 --> 00:16:14,970
just a variable floating there in our

310
00:16:14,970 --> 00:16:17,220
script, not connections to the other

311
00:16:17,220 --> 00:16:20,880
parts. So what we need to do is, we said

312
00:16:20,880 --> 00:16:25,890
that, that one, that list is that a

313
00:16:25,925 --> 00:16:29,765
list. So we need to assign it to series,

314
00:16:29,790 --> 00:16:32,820
right. hc.options.series

315
00:16:33,030 --> 00:16:38,010
equal to hc.data. Right. Now, I'm

316
00:16:38,010 --> 00:16:42,930
going to stop the script and run and

317
00:16:42,930 --> 00:16:46,252
visit the app, and this is the output.

318
00:16:47,881 --> 00:16:51,365
Here is the x axis with the Month and this

319
00:16:51,390 --> 00:16:57,450
is our Ratings, so from 2.5 upto 5.5.

320
00:16:58,468 --> 00:17:01,798
The maximum is somewhere in here. So you

321
00:17:01,823 --> 00:17:04,673
can hover the mouse there, and you see

322
00:17:05,010 --> 00:17:08,640
the ratings for each course. Right. The

323
00:17:08,700 --> 00:17:12,240
legend here is floating. So if you want

324
00:17:12,240 --> 00:17:14,220
to change that, you can go back to your

325
00:17:14,220 --> 00:17:18,780
code and locate the legends here. So you

326
00:17:18,780 --> 00:17:20,760
have some parameters here, which you can

327
00:17:20,790 --> 00:17:26,221
experiment with. But if I set floating to false

328
00:17:26,245 --> 00:17:30,957
[No audio]

329
00:17:30,982 --> 00:17:34,770
that should change the view of

330
00:17:34,770 --> 00:17:36,960
a graph. So I think this is more clear.

331
00:17:37,830 --> 00:17:41,850
Now, I wouldn't agree that this type of

332
00:17:41,850 --> 00:17:44,190
graph is the best representation for

333
00:17:44,190 --> 00:17:47,250
these kinds of data because we have

334
00:17:47,250 --> 00:17:49,470
multiple lines here. But they are so

335
00:17:49,470 --> 00:17:52,620
close to each other. So there's no much

336
00:17:52,620 --> 00:17:55,800
variations between one course and the

337
00:17:55,800 --> 00:17:59,940
other. I think these splines would be

338
00:17:59,940 --> 00:18:03,870
more representative if we had, instead

339
00:18:03,870 --> 00:18:06,870
of averages, we have the count of the

340
00:18:06,870 --> 00:18:09,270
reviews of the ratings left for each

341
00:18:09,270 --> 00:18:11,730
course, which means we have to go to the

342
00:18:11,730 --> 00:18:14,970
processing section and say here count

343
00:18:15,000 --> 00:18:17,790
instead of mean, and let me try that.

344
00:18:17,814 --> 00:18:23,465
[No audio]

345
00:18:23,490 --> 00:18:26,670
So yeah, it looks better I think. We

346
00:18:26,670 --> 00:18:28,680
have more variation, more difference

347
00:18:28,710 --> 00:18:30,870
between of this plot and the other

348
00:18:30,870 --> 00:18:32,970
ones. Although the other ones

349
00:18:32,970 --> 00:18:37,020
are still not as visible since this plot

350
00:18:37,020 --> 00:18:41,220
here is taking a lot of the range of the

351
00:18:41,250 --> 00:18:44,820
y axis range. Therefore, what I'm

352
00:18:44,820 --> 00:18:46,800
going to do next in the next video is

353
00:18:46,800 --> 00:18:49,740
I'm going to use another type of graph

354
00:18:49,740 --> 00:18:53,280
to represent the same, the exact same data,

355
00:18:53,378 --> 00:18:56,348
average ratings by course by months but

356
00:18:56,400 --> 00:18:58,470
using a stream graph. I'll talk to you

357
00:18:58,470 --> 00:18:59,500
in the next video.