An unconventional Javascript library for exploring mathematical drawing.
- Cursor-based
How to describe this shape?
It is a tilted rectangle.
We could describe the lengths of its sides and the angle it is tilted.
We could even say its position relative to the frame of the picture. But that isn't very important, especially as the picture frame is invisible in this case.
The last thing we would be interested in is the exact position of each corner relative to the picture frame. Unfortunately, that is precisely how most drawing libraries would expect you to describe it. How about this one?
The simplest way would be to describe the length of each edge and the angles between them. Tymless.js tries to let you describe shapes like this, by starting at one corner and moving around the perimeter describing lengths and angles.
On modern computers we are used to the idea of cursors for keeping track of where we are. When you edit a text file, you know where the text will appear as you type because of a cursor. When we write a computer program, we know that the computer will run a cursor back and forwards through it until it reaches the end. This is why I call Tymless.js a cursor-based drawing program. You may know of of a computer language called Logo, which was the first to use cursor-based drawing.
There are advantages to this approach. If you want to draw your shape in multiple places and orientations, it doesn't make much sense to specify exactly where its corners are relative to the frame.
- Shape inflation
- Advanced colours
- Animation
- Complex arithmetic
This page uses Ground Floor to style the page, click here to see some code examples. You can opt-out of this style and make your own design by removing the "default.css" link in the HTML.