回転 X(180 度) 回転 Y(180 度) を実行すると、上下が逆になります。したがって、マウスがドラッグ時に子要素を上に移動するように設定されている場合、その子要素は下に移動します (設定方法によって異なります)。
-webkit-transform: rotateX(?deg) rotateY(?deg) rotateZ(?deg); // where does it point?
WEBキットのセットアップのみ
フィドルを見てみましょう(コードはごちゃごちゃで、取り除かれています)。コンピューターのモニターに、円形に配置された 360 個の目盛りを描きます。矢印が指している目盛りをどのように見分けることができますか (ボックスが円の正確な中心にあると仮定します)。
*編集 - 使用されている変換元は立方体の中心にあります
注:以下はすべて、この例のように、原点を通過するベクトルを使用していることを前提としています。元の例では、ベクトルはベクトルによって原点からさらにオフセットされ[0, 0, 60]ます。これは計算が少し複雑になるため、簡略化したものを使用して説明します。
あなたのベクトルは現在、定義済みのベクトルに回転を連続的に適用する球面座標 オイラー角 によって定義されています。回転を使用して、最終的なベクトルのデカルト座標を決定する方法は次のとおりです。
あなたのベクトルが[0, 1, 0]（矢印が1単位の長さで、原点から始まると仮定して）
ベクトルにここで説明する回転行列を任意の順序で掛けて、x、y、z 回転を適用します。θ は、それぞれの場合に対応する角度に置き換えます。
結果のベクトルは、指定された x、y、および z 回転によって変換された元のベクトルです。
回転したベクトルを取得したら、xy 平面へのベクトルの投影を簡単に見つけることができます。
たとえば、ベクトル[10, 20, 30](デカルト座標) を考えると、xy 平面への投影は ベクトル[10, 20, 0]です。水平からのこのベクトルの角度は、次のように計算できます。
tan -1 (20/10) = 1.107 rad (正の x 軸から反時計回り)
= 63.43 度 (正の x 軸から反時計回り)
これは、右を指している目盛りから反時計回りに数えて 63 番目と 64 番目の「目盛り」の間を指す矢印を意味します。