dynamic-learning / simulation-library-ideas

Space for requesting and suggesting ideas for new simulations
1 stars 0 forks source link

Linear Algebra #1

Open nickmcintyre opened 4 years ago

nickmcintyre commented 4 years ago

I think creating an interactive version of 3b1b's Essence of linear algebra series is a good starting point for a few reasons:

  1. The topic is widely applicable and challenging for many.
  2. Creating the simulations will give us a good idea of what manim features we need to bring to the p5.js ecosystem.
  3. I happen to be reviewing linear algebra, so teaching it back would aid my own understanding.

What do you think @JithinKS97?

JithinKS97 commented 4 years ago

Yeah definitely. I was always thinking of doing this someday. I'm fairly sure that somebody might have already tried doing something like this or at least would have thought about this.

I'm definitely ready to jump in and help. Even I myself wanted to improve my understanding of Linear algebra. We can definitely discuss more about how do we want to approach this.

One thing that I would like to say is when we are creating simulations, definitely, there would be elements that we can reuse in the later projects. So prior to coding, if we have some plans, we can write the code for these elements in a reusable way (Or maybe even create a library of these kind of elements). An example of this is p5.rnd that I created. I created trajectory-lab using this reusable component.

If you can, would you be able to plan such reusable components?

nickmcintyre commented 4 years ago

Cool! I'll start hacking on this.

I believe I floated the SDK idea when you proposed rewriting the app. It may make more sense to curate a set of libraries and examples for developers to build upon. For math, I'll work to bring número, p5.plot, and p5.TeX up to par.

You're more than welcome to help but I don't want to divert too much of your attention from the rewrite. I'll be happy to incorporate your feedback once I've had the chance to build a simulation or two.

JithinKS97 commented 4 years ago

Building an SDK is the ideal thing that we should do. But I think we are not there yet. I think we should reach there by building a set of libraries and building many simulations using that. So in the process we will know the pain points of building simulations. We will also know what are the elements that appear again and again for which we can build reusable pieces.

A plotting library in p5 is something that I'll love to work on. If you can create some issues in the repo. I can take a look whenever I get time.

JithinKS97 commented 4 years ago

Hey @nickmcintyre I'm planning to write a 2d graph plotting library similar to this. https://www.dynamiclearning.io/workbookeditor/9qGz7QBQgFfB5qqCh

This was created very rapidly and the code is not well structure. My plan is to create a more structured library with more features like graph zooming and panning. I'm going to use typescript

Sharing the Repo here https://github.com/JithinKS97/p5.graph

I saw the p5.plot library that you are creating. Can we combine these two so that we can share ideas and create a single plotting library?

nickmcintyre commented 4 years ago

@JithinKS97 certainly! One consideration as you get started:

I studied manim while laying out the basic structure of p5.plot and it makes sense. But I struggle to justify not just using D3.js... seems to have everything we need and then some. Thoughts?

JithinKS97 commented 4 years ago

Yeah, you are right. D3 has plenty of helper functions to draw graphs. We can make use of that. That is what you meant right? Or we don't need a p5.graph / p5.plot library as such and instead just use d3 in p5 sketch?

JithinKS97 commented 4 years ago

D3 is used for drawing using SVG elements right? Or does it help in Canvas also? My idea is to create a library that helps to embed a graph within p5 sketch itself.

nickmcintyre commented 4 years ago

D3 can render to the canvas as well. Here is a quick example of the two libraries working together on the same canvas.

What do you think about creating a minimal wrapper around D3? We could figure out what subset of its API is essential for typical math visualizations and make it simple to use.

JithinKS97 commented 4 years ago

Yeah, we can do that. But I've already created a basic version. In the graph, you have a grid and also pan and zoom functionality https://p52dgraph.netlify.app/

Here is the p5 sketch https://github.com/JithinKS97/p5.graph/blob/master/sketch.js

Here is the typescript library code https://github.com/JithinKS97/p5.graph/blob/master/lib/src/index.ts

JithinKS97 commented 4 years ago

Hey, @nickmcintyre How is the work coming along. Were you able to make any progress? I was planning to add some simulations to the Simulations repo section of dynamic learning (https://www.dynamiclearning.io/simulations). I thought I'd get your suggestions.