Mathematix

A simple Mathematix graph: y = x * sin(x)

Inspiration

The idea of Mathematix originated when one of our team members was using Blender’s nodeblock tools to composite image data. He then attempted to use Desmos to graph some complex mathematical calculations, but found typing the formulas to be slightly difficult and tedious. He then came up with the idea to combine Blender’s nodeblock tools with Desmos’s graphing capabilities to create a nodeblock-based program that could graph functions, all in the interest of making a graphing calculator easier to use.

What it does

Mathematix is a visual math interface that enables individuals to construct and graph complex equations in an interactive way. As opposed to conventional methods of constructing equations, Mathematix uses nodeblocks that contain values or operations, which can be connected to each other to construct equations that would otherwise need to be completely written out.

How we built it

For this project, we used a simple tech stack of vanilla Javascript, HTML, and minimal CSS. We used a library called Nerdamer to evaluate parsed functions as strings, and solve for different variables. This library has proven useful in asymptote detection, which is important for drawing accurate graphs.

Challenges we ran into

During the creation of this project, we ran into a lot of bugs that were difficult to isolate and properly correct without causing any additional problems. Oftentimes, when we would edit our code to fix those bugs, it would result in the creation of another bug that then needed to be fixed. Additionally, the initial integration of the Nerdamer library caused some output-related problems.

Accomplishments that we're proud of

One accomplishment that we are proud of is creating an intuitive UX/UI. Mathematix has features such as typing inputs into a node and previewing functions before graphing them, all in a comfortable workspace.

What we learned

We learned that it is important to keep code readable in order to make it easier to add new features and fix bugs. Especially when it comes to having multiple files that all interact with each other, a combination of simplicity and functionality is essential. We also learned the value of delegating tasks within a team, as this makes the development process more efficient and allows for more features to be implemented within short timeframes.

What's next for Mathematix

The next thing we would like to implement in Mathematix is saving graphs and their functions. Currently, node networks can be made to accurately graph functions on the website, but there is no option to save them for later use. Along with this implementation, we hope to make further improvements to the application’s existing features. For example, zooming in and out of the editor and graphing areas is on our to-do list.

Built With

Submitted to

QubitX Hacks by YCW
- Winner First

Created by

I worked on some final polishing touches, like making some styling changes and cleaning up various issues.

Jossaya Camille
I prototyped the UX/UI, programmed the original minimum viable product, and animated the project 'ad' in Blender, a program that was one of our major inspirations for the project.

Makai P.
I worked on the foundational research and the documentation. I also helped implement one of the functions.

Valerie F.
I worked on asymptote detection, input boxes, and object-oriented some parts of the code. I also created the node-preview you see on the graph in red.

AlexanderJCS Castronovo