punxch / matrix-animation

This a animation tool to show how a matrix transform the space.

Home Page:https://webtool.lihs.me/matrix-animation

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Matirx-Animation

This a animation tool to show how a matrix transform the space.

Inspired by the book:

  • 《程序员的数学3 线性代数》(ISBN: 9787115417749)
  • 《プログラミングのための線形代数》(ISBN: 9784274065781)

Programs the book provide is not easy to run(too more dependences).

So this repo is here.

Why Not?

Why not use transform of CSS or SVG?

It will be aslo transform the stroke-width and more in this way. What wanted is observe the transform of coordinates, not the transform of the whole graphic.

Usage

Download matrix-animation.zip.

Open index.html in your browser(best is latest Chrome) by a http(s) server.

For example:

unzip matrix-animation.zip -d matrix-animation
cd matrix-animation
python3 -m http.server
# open http://localhost:8000/

TODOs

  • Able to set arrow vector
  • Demos of 《程序员的数学3 线性代数》(ISBN: 9787115417749)
  • Show cursor coordinate of SVG
  • Control animation process with input[type="range"]
  • Refactoring JS Files(33%)
    • Add packaging tools
    • Split index.js to modules
    • Add TypeScript
  • Deploy to a free serverless platform
  • Optimize webpack config

About

This a animation tool to show how a matrix transform the space.

https://webtool.lihs.me/matrix-animation

License:GNU General Public License v3.0


Languages

Language:JavaScript 71.9%Language:HTML 15.2%Language:CSS 12.8%