search

greggman / twgl.js

A Tiny WebGL helper Library
http://twgljs.org
MIT License
2.61k stars 258 forks source link

Translation matrix works not as expected #182

Closed kirevdokimov closed 3 years ago

kirevdokimov commented 3 years ago

Definition

Matrix representation of translation defined as this: изображение https://en.wikipedia.org/wiki/Translation_(geometry) First three components of 4th column is case of 4x4 matrix.

Source of truth

Result of one case of multiplication is this: изображение https://www.wolframalpha.com/input/?i=%7B%7B1+%2F+10%2C+0%2C+0%2C+5%7D%2C+%7B0%2C+1%2C+0%2C+0%7D%2C+%7B0%2C+0%2C+1%2C+0%7D%2C%7B0%2C+0%2C+0%2C+1%7D%7D+.+%7B10%2C0%2C0%2C1%7D

TWGL Behaviour

Same multiplication case

console.log(twgl.m4.transformPoint([

  1 / 10, 0, 0, 5,
    0,    1, 0, 0,
    0,    0, 1, 0,
    0,    0, 0, 1

], [ 10, 0, 0, 1 ]))

Expected result is (6,0,0) see source of truth Actual result is изображение

But if I replace translation component from last column to last row

console.log(twgl.m4.transformPoint([

  1 / 10, 0, 0, 0,
    0,    1, 0, 0,
    0,    0, 1, 0,
    5,    0, 0, 1

], [ 10, 0, 0, 1 ]))

It returns expected results for previous case

изображение

As I can see translation is stored in last row instead of last column https://github.com/greggman/twgl.js/blob/0a44471ab91d068dae3ccc85f3054eeeb4c19a3a/src/m4.js#L419-L422

What is the reason to do that way instead of classic approach?

Thank you for your work!

greggman commented 3 years ago

Because that's the way pretty much all speed oriented math libraries work. OpenGL, glm, etc ....

See this article