 So, most of the stuff I want to talk about has been talked about in lecture, so I covered the differences, so that it is not a waste of time. So, I mean I was playing with the cross filter. Cross filter is a filtering library for JavaScript, I quickly do the introduction. What cross filter does is, I guess, severe developer last few years. And currently I am running a personal finance startup in Bangalore. Earlier I was, I did a startup in tax filing space for clear tax. Now, why I got into it? So, I was playing with cross filter, I got fascinated with the whole interactive filtering thing. And at the same time I learned about Angular. And I was curious that, you know, can you merge these two? Can we have, you know, cross filter work in Angular framework? I was a motivation. So, what I did was I submitted a proposal at Meta Refresh that if I get selected, then I'll probably, you know, finish this up. Yeah, I think I should have listed. Despite all those, two were like from me and my mate. And, you know, I got a call six days before that, you know, your talk is selected, now come present. So, I had six days to get this work done. Why cross filter? Practical filtering? Can quickly show you. I mean, you can see that, you know, the data below is changing and the data below is also changing. What this means is that, you know, the data model behind all these plots are connected. It's the same model because that's why when you change data in one of the plots, everything gets affected. It's a similar analogy to database indices, you know, where you build an index, you create an index, then you can do range queries. So, what this library does is it brings the whole database in this concept to print it. You can do all those kind of queries just at the plot. We talked about that AngularJS has its own data binding. And how do you manage these two? Now, well, plotting is a top manipulation. All right. So, in order to do a plot, you have to write the rectus code. So, what I'm going to do is I'm going to take the same piece of code and show you how it was earlier in jQuery LAN and now how it is different in the AngularJS LAN. All right. So, this is the JavaScript code. Let me show you another example. So, what this does is this is a data about venture capital investment in different states, in different industries. And what you can do is you can select a particular state, a particular industry, and the whole data moves accordingly. The way it was done in jQuery LAN is that you read the data, you run the cross filter on top of it, you create dimensions. The dimensions are nothing but indices on which you can learn the range queries. And then once, so this is basically like setting up a state. You read the data, you set the state. And all the graphs share the same state so that when you change the data, the state changes and all graphs get updated by that. And once the data is read, the state is set, it creates the plots, which is the domain equation. So, the challenge I had was that I wanted to create like this for each of the plots and I wanted them to share data. I wanted them to share the state so that if one directive, a change, any range of data, it changes for everything. And that's how they will stay connected. That's how cross filter works. That's how, because they pay this data model, which all the plots share and indexes are created and then you can change the value of plot in one of the plots. Change the value in one of the plots and everything gets reflected. So, how do we do that? Well, in Angular, there is something called Services which Lakshman introduced, or Factory. Now, Factory asking returns. So, what it means is that you can create an instance, sorry, you can declare a factory, you can create your state in the factory and you can pass this state in all your directives. And once, since all the directives will share the state, now when you, you know, change the data. So, it's like this, the two-step process of creating the state and doing the domain equation is moved into creating a factory for creating the state and each of the domain equation is done in each of the directives. So, this is what we do for, you know, creating directives. We declare two directives, US chart in the street chart for declaring the states and industry in the bubble chart. So, what happens inside US chart? We pass the factory, which contains the state. We declare that a common definition of an element type, we declare an isolated scope and this is where the all action happens, link. I mean, and link has access to the factory. So, we watch, I come to this, you know, watch part in a bit. So, what it does is it has access to the CF and it leads the state from it to create the dimension and to create the plot. And it happens similarly in the industry chart. This is the industry directive and it has access to the factory as well. So, it creates the state which has been created in the factory. Now, there is one more thing actually. There is an async part where, now let's look at the control flow. How does the flow of the flow happens? Now, we declare a controller and controller also has access to the factory. This calls the setup method. Now, what is setup is one of the methods which has been exposed in the factory. So, factory exposes setup method, which is to create the setup, the state and there are other bunch of methods which are to access the different values of the state. So, what setup does is it reads the file, creates the state and once it is done reading all the files, it calls the digest. What digest calls is it re-regulates the plot and within the directive, within the US chart and the industry chart which we are trying to plot here. So, within these charts, it forces for the variable val. This val comes from here in the HTML. Now, once this val gets populated within the setup method, it calls the digest and the control comes here. It sees that the val has changed and it doesn't call. So, that's how the asynchronous part of the code is taken care of. And this is what it has done using Angular. I guess to sum this up, I would say that all the things we learned from Latchman's talk, the differences were that it is a data sharing concept which I had to deal with while I was doing this and the factories being singled out came to rescue. The asynchronous nature for that we used the digest and the watch. The watch, you can use any variable and it changes the plot level. There is scoping. So, you can use the scoping to... I mean, scoping is a little bit of binding. So, once you want the variable you are watching to be available, to be visible, so for that you take the accelerated scope for that variable. So, it worked and, you know, it worked in the last couple of days. So, I was fine with it. I can present this. There are some references. Cross-winter, you can look at. For the DC, you can look at. DC is a derivative of cross-winter which builds for ads, meta charts on top of it. What else? Angular D3. Angular D3 is the third reference which talks about how to build D3 plots or SVG plots using Angular. So, that's where it shows how to make directives to build SVG plots. The fourth one is a good tutorial reference for Angular. Yeah, that's it. Any questions? I guess because of the top, there will be a top. Thank you. It's a cap for my certification.