1 00:00:01,630 --> 00:00:01,960 Hi. 2 00:00:01,960 --> 00:00:05,440 In this video, I'll show you my solution to the data app. 3 00:00:05,440 --> 00:00:09,550 So I demonstrated you how the data app should look like. 4 00:00:09,550 --> 00:00:10,990 So that's the data app. 5 00:00:11,020 --> 00:00:13,660 And here is my code. 6 00:00:14,410 --> 00:00:20,590 So in this pie chart project I have two files Happy, dot, csv and main dot pie. 7 00:00:21,490 --> 00:00:23,530 So this is main dot pie. 8 00:00:24,630 --> 00:00:26,950 And that's what I have. 9 00:00:26,970 --> 00:00:30,210 So I imported stream late plot Li and Pandas. 10 00:00:30,420 --> 00:00:33,740 I added a title to the web page. 11 00:00:33,750 --> 00:00:37,500 Then I added to select boxes. 12 00:00:38,620 --> 00:00:42,850 Which corresponds to these two select boxes in here. 13 00:00:43,300 --> 00:00:51,970 So when the page loads for the first time by default, GDP is the selection of both select boxes. 14 00:00:52,000 --> 00:00:56,680 That's because GDP is the first item of the tuple here. 15 00:00:56,860 --> 00:01:00,490 So that's a tuple which contains the values of the select box. 16 00:01:00,490 --> 00:01:04,660 And that's the title of the select box which corresponds to that. 17 00:01:06,100 --> 00:01:13,930 Then I load the dataframe because now it's time to get some data from Happy dot CSV. 18 00:01:14,200 --> 00:01:16,610 And that's my match case block. 19 00:01:16,630 --> 00:01:19,390 So I have to match case blocks, actually. 20 00:01:21,370 --> 00:01:21,970 There you go. 21 00:01:22,000 --> 00:01:23,300 That's a complete code. 22 00:01:23,320 --> 00:01:25,000 So this is how I did it. 23 00:01:25,150 --> 00:01:28,250 I sat here, matched option X. 24 00:01:28,270 --> 00:01:38,170 Now, option X is this for select box and option X will get as a value one of the selections. 25 00:01:38,170 --> 00:01:43,150 So either the GDB, string, happiness, string, or generosity string. 26 00:01:43,900 --> 00:01:50,470 So whatever the user selects here in the first select books, that string is going to be the value of 27 00:01:50,470 --> 00:01:51,760 this variable. 28 00:01:52,270 --> 00:02:01,870 That's why here I'm trying to match the value of this variable against happiness, against GDP, against 29 00:02:01,870 --> 00:02:02,980 generosity. 30 00:02:02,980 --> 00:02:10,960 So in other words, I'm trying to guess if the user entered happiness, if they entered happiness here 31 00:02:11,050 --> 00:02:19,180 in the first select box, then I extract the column happiness from the dataframe. 32 00:02:19,180 --> 00:02:22,690 Now it is possible that you have done this a bit differently. 33 00:02:22,690 --> 00:02:27,460 Perhaps in here you have this code. 34 00:02:29,180 --> 00:02:35,300 So perhaps what you're doing is you're checking a happiness is value, and then you render that directly. 35 00:02:36,370 --> 00:02:40,150 But I think this might be a bit better because it's less code. 36 00:02:40,150 --> 00:02:44,230 So it's better to create to prepare the variable first. 37 00:02:44,680 --> 00:02:51,250 So in this case, if the user entered happiness as a choice here, if they select this happiness, then 38 00:02:51,250 --> 00:02:53,030 I prepare the happiness column. 39 00:02:53,050 --> 00:02:55,630 Otherwise, I prepare a GDP column. 40 00:02:56,410 --> 00:02:58,630 The variable is the same, by the way. 41 00:02:58,750 --> 00:03:04,000 So x array will get one of these values. 42 00:03:04,210 --> 00:03:08,740 So that's or that's or that's column. 43 00:03:08,770 --> 00:03:11,920 Same goes for the option. 44 00:03:12,090 --> 00:03:12,880 Why? 45 00:03:14,070 --> 00:03:16,380 It's the same code, basically. 46 00:03:16,560 --> 00:03:18,010 Then we have the sub header. 47 00:03:18,030 --> 00:03:20,970 The sub header is a string. 48 00:03:21,840 --> 00:03:24,300 Which I'm constructing dynamically. 49 00:03:25,080 --> 00:03:27,210 So it corresponds to that. 50 00:03:27,210 --> 00:03:32,670 So you can see that the option ex variable will be rendered here as happiness. 51 00:03:32,670 --> 00:03:39,270 Currently, because the user has selected happiness and this will be rendered as GDP. 52 00:03:42,860 --> 00:03:49,130 So we generate a figure first and the x is x array. 53 00:03:49,130 --> 00:03:51,050 So that's a DataFrame column. 54 00:03:51,320 --> 00:03:58,640 That means at this point here we should have a value for x array. 55 00:03:58,640 --> 00:04:03,380 So the value should be either of these three rates. 56 00:04:04,770 --> 00:04:12,570 And that column is going to be used as the x axis, same for y array. 57 00:04:12,570 --> 00:04:14,520 And then we have the labels arguments. 58 00:04:14,520 --> 00:04:19,410 So in the x axis we will render the happiness string. 59 00:04:19,410 --> 00:04:26,910 In this case, when the user enters happiness here and for the y axis we will render a GDP. 60 00:04:26,910 --> 00:04:32,880 So the selection that the user makes here and then we plug the charts and that's it. 61 00:04:32,880 --> 00:04:34,380 So that's the final code. 62 00:04:34,380 --> 00:04:41,160 Don't worry if you did this differently or perhaps you missed something, it's important that you have 63 00:04:41,160 --> 00:04:45,180 thought about this problem and that helps a lot. 64 00:04:45,390 --> 00:04:48,240 Simply coding some lines helps a lot. 65 00:04:48,510 --> 00:04:50,550 So thanks a lot for listening to this. 66 00:04:50,550 --> 00:04:51,510 I'll see you later.