互動式探索：四元數與3D旋轉：英語精讀講義

In a moment, I'll point you to a separate website hosting a short sequence of what we're calling explorable videos. 用詞

稍後，我會向大家介紹一個獨立的網站，裡面代管了一系列我們稱之為「可探索影片」的短片。

It was done in collaboration with Ben Eater, 片語搭配

這是與 Ben Eater 合作完成的，

who some of you may know is that guy who runs the excellent computer engineering channel.

你們中有些人可能知道，他就是那個經營優秀電腦工程頻道的傢伙。

And if you don't know who he is,

如果你不知道他是誰，

viewers of this channel would certainly enjoy the content of his.

這個頻道的觀眾肯定會喜歡他的內容的。

So do check it out. 講解

所以一定要去看看。

This collaboration was something a little different though,

不過，這次合作有些與眾不同，

for both of us.

對我們倆來說都是如此。

And all of the web development that made these explorable videos possible

所有讓這些可探索影片成為可能的網頁開發工作，

is completely thanks to Ben.

都要完全歸功於 Ben。

I don't want to say too much about it here.

我不想在這裡說太多。

It's really something you have to experience for yourself.

這真的是你需要親自去體驗的東西。

Certainly one of the coolest projects I've had the pleasure of working on. 片語搭配

這絕對是我有幸參與過的最酷的專案之一。

Before that though,

不過在此之前，

if you can contain your excitement, 語氣意圖

如果你能按捺住激動的心情，

I want to use this video as a chance to tee things up with a little bit of surrounding context. 片語動詞

我想藉由這支影片的機會，透過一些背景知識來做個鋪墊。

So to set the stage, 慣用語

為了切入正題，

last video I described quaternions,

上支影片我介紹了四元數，

a certain four-dimensional number system

這是一個特定的四維數字系統，

that the 19th century versions of Wolverine and the old man from Home Alone

被19世紀版的金鋼狼和《小鬼當家》裡的老爺爺

called evil for how convoluted it seemed at the time.

稱其為「邪惡」，因為在當時它看起來太複雜了。

And perhaps you too are wondering

也許你也會好奇，

why on earth anyone would bother with such an alien seeming number system. 講解

到底為什麼有人要費心去弄這種看似外星產物的數字系統。

Well,

那麼，

one of the big reasons,

最大的原因之一，

especially for programmers,

特別是對於程式設計師來說，

is that they give a really nice way for describing 3D orientation,

是它們提供了一種非常好的描述 3D 朝向的方法，

which is not susceptible to the bugs and edge cases of other methods. 講解

並且不易受到其他方法中的錯誤和邊界情況的影響。

I mean,

我的意思是，

they're interesting mathematically for a lot of reasons,

雖然它們在數學上因很多原因而很有趣，

but this application for computer graphics and robotics and virtual reality

但這種在電腦圖學、機器人技術、虛擬實境

and anything involving 3D orientation is probably the biggest use case for quaternions. 用詞

以及任何涉及 3D 朝向的領域中的應用，可能是四元數最大的用武之地。

To take one example, 表達脈絡

舉個例子，

a friend of mine who used to work at Apple, 文法

我的一位曾在蘋果工作過的朋友，

Andy Matuschak,

Andy Matuschak，

delighted in telling me about shipping code to hundreds of millions of devices that uses quaternions to track the phone's model for how it's oriented in space. 用詞

很樂意地告訴我，他們發布到數億台裝置上的程式碼，就是使用四元數來追蹤手機在空間中的朝向模型的。

That's right.

沒錯。

Your phone almost certainly has software running somewhere inside of it that relies on quaternions.

你的手機裡幾乎肯定在某個地方執行著依賴四元數的軟體。

The thing is, 表達脈絡

問題是，

there are other ways to think about computing rotations,

計算旋轉還有其他的思考方式，

many of which are way simpler to think about than quaternions. 文法

其中很多方法都比四元數容易理解得多。

For example,

例如，

any of you familiar with linear algebra will know that 3 x 3 matrices can really nicely describe 3D transformations. 文法

熟悉線性代數的人都知道，3x3 矩陣可以很好地描述 3D 變換。

And a common way that many programmers think about constructing a rotation matrix for a desired orientation

對於所需朝向，許多程式設計師建構旋轉矩陣的一種常見思考方式

is to imagine rotating an object around three easy to think about axes,

是想像將一個物體圍繞三個易於理解的軸進行旋轉，

where the relevant angles for these rotations are commonly called Euler angles.

這些旋轉的相關角度通常被稱為歐拉角。

And this mostly works,

這在大多數情況下都管用，

but one big problem is that it's vulnerable to something called gimbal lock,

但一大問題是它容易出現所謂的「萬向節死鎖」（Gimbal Lock），

where when two of your axes of rotation get lined up, 片語動詞

當你的兩個旋轉軸重合時，

you lose a degree of freedom. 用詞

你就會失去一個自由度。

And it can also cause difficulties and ambiguities

此外，它還可能引起困難和歧義，

when trying to interpolate between two separate orientations. 片語搭配

當試圖在兩個獨立朝向之間進行插值時。

If you're curious for more of the details,

如果你對更多細節感到好奇，

there are many great sources online for learning about Euler angles and gimbal lock,

網路上有很多學習歐拉角和萬向節死鎖的優秀資料，

and I've left links in the description to a few of them.

我在資訊列裡留下了一些連結。

Not only do quaternions avoid issues like gimbal lock, 文法

四元數不僅避免了萬向節死鎖等問題，

they give a really seamless way to interpolate between two three-dimensional orientations,

它們還提供了一種在兩個三維朝向之間進行插值的無縫方法，

one which lacks the ambiguities of Euler angles, 文法

這種方法不僅沒有歐拉角的歧義，

and which avoids the issues of numerical precision and normalization

也避免了在嘗試對兩個旋轉矩陣進行插值時，

that arise in trying to interpolate between two rotation matrices.

出現的數值精度和正規化問題。

To warm up to the idea of how multiplication in some higher-dimensional number system 片語動詞

為了熟悉一下在某種高維數字系統中，

might be used to compute rotations,

如何利用乘法來計算旋轉的思路，

take a moment to remember how it is that complex numbers give a slick method for computing 2D rotations. 文法

花點時間回想一下，複數是如何為計算 2D 旋轉提供巧妙方法的。

Specifically,

具體來說，

let's say you have some point in two-dimensional space, 表達脈絡

假設你在二維空間中有一個點，

like 4 1,

比如 (4, 1)，

and you want to know the new coordinates you'd get if you rotate this point 30 degrees around the origin. 文法

你想知道將這個點繞原點旋轉30度後得到的新座標。

Complex numbers give sort of a snazzy way to do this.

複數提供了一種相當時髦的方式來做到這點。

You take the complex number that's 30 degrees off the horizontal with magnitude one,

你取一個偏離水平方向30度且幅度為1的複數，

cosine 30 degrees plus sine of 30 degrees times I,

即 cos(30°) 加上 sin(30°) 乘以 i，

and then you just multiply this by your point,

然後你只需將它乘以你的點，

represented as a complex number.

這裡將點表示為一個複數。

The only rule you need to know to carry out this computation is that I squared equals negative one. 片語動詞

執行這一計算你需要知道的唯一規則是 i 的平方等於 -1。

And then,

然後，

in what might feel like a bit of black magic to those first learning it, 講解

對於剛開始學習的人來說，這可能感覺有點像黑魔法，

carrying out this product from that one simple rule gives the coordinates of a new point,

根據那個簡單的規則算出這個乘積後，就得到了一個新點的座標，

the point rotated 30 degrees from the original.

即那個從原來的點旋轉了30度之後的點。

Using quaternions to describe 3D rotations is similar,

使用四元數來描述 3D 旋轉也是類似的，

though the look and feel is slightly different. 片語搭配

儘管外觀和感覺略有不同。

Let's say you want to rotate some angle about some axis.

假設你想圍繞某個軸旋轉某個角度。

You first define that axis with a unit vector,

首先，你用一個單位向量定義那個軸，

which we'll write as having I, J, and K components,

我們把它寫成包含 i、j 和 k 三個分量，

normalized so that the sum of the squares of those components is one. 用詞

並進行正規化，使得這些分量的平方和等於1。

Similar to the case of complex numbers, 表達脈絡

與複數的情況類似，

you use the angle to construct a quaternion by taking cosine of that angle as the real part,

你用這個角度來建構一個四元數：取該角度的餘弦值作為實部，

plus sine of that angle times an imaginary part,

加上該角度的正弦值乘以一個虛部，

except this time the imaginary part has three components,

只是這次虛部有三個分量，

the coordinates of our axis of rotation.

也就是我們的旋轉軸的座標。

Well, 表達脈絡

嗯，

actually you take half of the angle,

實際上你要取角度的一半，

which might feel totally arbitrary,

這可能會讓人感覺完全是任意的，

but hopefully that's going to make some sense by the end of this whole experience.

但希望在整個體驗結束時，這能讓你覺得是有道理的。

Now let's say you have some 3D point,

現在假設你有一個 3D 點，

which we'll write with I, J, K components,

我們將其用 i、j、k 分量寫出來，

and you want to know the coordinates that you'd get when you rotate this point by your specified angle around your specified axis.

你想知道將這個點圍繞你指定的軸，旋轉你指定的角度後會得到的座標。

What you do is not just a single quaternion product, 文法

你所做的不僅僅是單一的四元數乘積，

but a sort of quaternion sandwich, 慣用語

而是一種「四元數三明治」，

where you multiply by Q from the left 片語搭配

你要從左邊乘以 Q，

and the inverse of Q from the right.

並從右邊乘以 Q 的反矩陣（逆元素）。

If you know the rules for how I, J, and K multiply amongst themselves,

如果你知道 i、j 和 k 之間如何相乘的規則，

you can carry out these two products by expanding everything out,

你可以透過把所有項展開來完成這兩個乘積的計算，

or more realistically by having a computer do it for you.

或者更現實一點，讓電腦替你算。

And in what might feel like a bit of black magic,

而在一種可能感覺有點像黑魔法的過程中，

this big computation will return for you the rotated version of the point.

這個龐大的計算將為你返回那個點被旋轉後的版本。

Our goal is to break this down 片語動詞

我們的目標是把它分解，

and visualize what's happening with each of these two products.

並視覺化這兩個乘積中每一個步驟發生的事情。

I'll review the method for thinking about quaternion multiplication described last video

我將回顧上支影片中描述的關於四元數乘法的思考方法，

and explain why half the angle is used

並解釋為什麼使用的是角度的一半，

and why you would multiply from the right by the inverse.

以及為什麼要從右邊乘以它的逆元素。

On the screen now and at the top of the description,

現在螢幕上和資訊列的頂部，

you'll find a link to eater.net/quaternions,

你會找到一個連結 eater.net/quaternions，

which is where Ben set up the explorable video tutorial where I explain what's going on with this rotation computation.

Ben 在那裡建立了這個可探索的影片教學，我在裡面解釋了這個旋轉計算到底是怎麼回事。

It's just really cool.

這真的非常酷。

Eater did something awesome here.

Eater 在這裡做了一件了不起的事情。

So at the very least, 片語搭配

所以，最起碼的，

just take a couple minutes to go look at it.

花上幾分鐘去看看它吧。

But I'd love it if you went through the full experience. 語氣意圖

不過如果你能體驗一下完整的過程，那就太好了。