このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

DOMMatrixReadOnly: rotateAxisAngle() メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2020年1月.

メモ: この機能はウェブワーカー内で利用可能です。

rotateAxisAngle()DOMMatrixReadOnly インターフェイスのメソッドで、指定されたベクトルと角度でソース行列を回転させて生成された、新しい DOMMatrix を返します。元の行列は変更されません。

行列を回転させた形に変更するには、DOMMatrix.rotateAxisAngleSelf() を参照してください。

構文

js
rotateAxisAngle()
rotateAxisAngle(rotX)
rotateAxisAngle(rotX, rotY)
rotateAxisAngle(rotX, rotY, rotZ)
rotateAxisAngle(rotX, rotY, rotZ, angle)

引数

rotX

数値です。回転軸を示すベクトルの X 座標です。ゼロでない場合、is2D は false になります。

rotY 省略可

数値です。回転軸を示すベクトルの Y 座標です。未定義の場合、rotX 値が使用されます。ゼロでない場合、is2D は false になります。

rotZ 省略可

数値です。回転軸を示すベクトルの Z 座標です。未定義の場合、rotX 値が使用されます。

angle 省略可

数値です。ベクトル軸の周囲を開店する角度の度数です。

返値

DOMMatrix です。

js
const matrix = new DOMMatrix(); // 行列を作成
console.log(matrix.rotateAxisAngle().toString()); // matrix(1, 0, 0, 1, 0, 0)
console.log(matrix.rotateAxisAngle(10, 20, 30).toString()); // matrix(1, 0, 0, 1, 0, 0)
console.log(matrix.rotateAxisAngle(10, 20, 30, 45).toString());
/* matrix3d(
    0.728, 0.609, -0.315, 0, 
    -0.525, 0.791, 0.315, 0, 
    0.441, -0.063, 0.895, 
    0, 0, 0, 0, 1) */
console.log(matrix.rotateAxisAngle(5, 5, 5, -45).toString());
/* matrix3d(
    0.805, -0.311, 0.506, 0, 
    0.506, 0.805, -0.311, 0, 
    -0.311, 0.506, 0.805, 0, 
    0, 0, 0, 1) */
console.log(matrix.toString()); // 出力: "matrix(1, 0, 0, 1, 0, 0)" (変化しない)

仕様書

Specification
Geometry Interfaces Module Level 1
# dom-dommatrixreadonly-rotateaxisangle

ブラウザーの互換性

関連情報