# Gallery: Linear transformation visualiser
**URL:** https://discourse.processing.org/t/gallery-linear-transformation-visualiser/31853
**Category:** Gallery
**Created:** [August 23, 2021, 5:16am UTC](https://discourse.processing.org/t/gallery-linear-transformation-visualiser/31853 "2021-08-23T05:16:53Z")
**Posts on this page:** 5
**Page:** 1
### Author:  [@Ariadne](https://discourse.processing.org/u/Ariadne)
#### Post date: [August 23, 2021, 5:16am UTC](https://discourse.processing.org/t/gallery-linear-transformation-visualiser/31853/1 "2021-08-23T05:16:53Z")
Recently, I was trying to create a 2D linear transformation visualiser to help one of my friends learn linear algebra. While I initially created it in Scratch 2.0 (my friend wasn’t familiar with any other programming language, and I wanted her to understand how the code worked), I quickly got frustrated and moved to p5.js, a more familiar environment.
# TODO
1. _Animate the transformation_ - ~~This should be reasonable easy, and p5.teach may help me with this.~~ **EDIT** : A version of the sketch that animates the transformation can be found [here](https://editor.p5js.org/subtra3t/sketches/0GN0qgHUA)!
2. _Make it fast_ - I don’t know about you, but on my PC the sketch is slightly laggy and jerky. Not much, but it’s slow. I may need help with this
3. _Add coordinates_ - Again, I may need help with this, since I don’t have a lot of experience with text in p5.js.
# TL;DR
I made a 2D linear transformation visualiser. Get the code [here](https://editor.p5js.org/subtra3t/sketches/mJIJBkP9q), or just play with it [here](https://preview.p5js.org/subtra3t/present/mJIJBkP9q).
---
### Author:  [@Ariadne](https://discourse.processing.org/u/Ariadne)
#### Post date: [August 24, 2021, 8:18am UTC](https://discourse.processing.org/t/gallery-linear-transformation-visualiser/31853/2 "2021-08-24T08:18:34Z")
Update: I’ve now added the determinant, along with the formula, rendered by KaTeX.
---
### Author:  [@paulgoux](https://discourse.processing.org/u/paulgoux)
#### Post date: [August 24, 2021, 8:23am UTC](https://discourse.processing.org/t/gallery-linear-transformation-visualiser/31853/3 "2021-08-24T08:23:46Z")
Do you mind if i convert this to processing later or do you already plan on doing this?
---
### Author:  [@Ariadne](https://discourse.processing.org/u/Ariadne)
#### Post date: [August 24, 2021, 11:13am UTC](https://discourse.processing.org/t/gallery-linear-transformation-visualiser/31853/4 "2021-08-24T11:13:59Z")
I’d be delighted it if you could translate this to Processing! I myself don’t know Java, so I couldn’t convert this to Processing even if I wanted to.
Note, however, that this sketch uses [KaTeX](https://katex.org) to render the LaTeX formulas and matrices. This is not available in Java, so you’ll probably want to use something like [JEuclid](http://jeuclid.sourceforge.net/).
---
### Author:  [@paulgoux](https://discourse.processing.org/u/paulgoux)
#### Post date: [August 24, 2021, 3:49pm UTC](https://discourse.processing.org/t/gallery-linear-transformation-visualiser/31853/5 "2021-08-24T15:49:23Z")
ok ill take a look and see what I can do.