DOMMatrix: rotateFromVectorSelf() メソッド
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月.
メモ: この機能はウェブワーカー内で利用可能です。
rotateFromVectorSelf() は DOMMatrix インターフェイスのメソッドで、指定されたベクトルと (1, 0) との間の角度で行列を回転させることで行列を変更する、変更を行う座標変換メソッドです。回転角度は、ベクトル (1,0)T と (x,y)T の間の時計回り方向の角度、すなわち (+/-)arctan(y/x) で決定されます。x と y が両方とも 0 の場合、角度は 0 として指定され、行列は変更されません。
ベクトルから行列を回転させる際に元の行列を書き換えずに処理するには、DOMMatrixReadOnly.rotateFromVector() を参照してください。このメソッドは元の行列を変更せずに、新しい回転後の行列を生成します。
構文
js
rotateFromVectorSelf()
rotateFromVectorSelf(rotX)
rotateFromVectorSelf(rotX, rotY)
引数
返値
自分自身を返します。更新された DOMMatrix です。
例
js
const matrix = new DOMMatrix(); // 行列を作成
console.log(matrix.rotateFromVectorSelf().toString());
// 出力: matrix(1, 0, 0, 1, 0, 0) (回転は適用されない)
console.log(matrix.rotateFromVectorSelf(10, 20).toString());
// 出力: matrix(0.447, 0.894, -0.894, 0.447, 0, 0)
console.log(matrix.toString());
// 出力: matrix(0.447, 0.894, -0.894, 0.447, 0, 0) (上記と同じ)
仕様書
| Specification |
|---|
| Geometry Interfaces Module Level 1> # dom-dommatrix-rotatefromvectorself> |
ブラウザーの互換性
関連情報
DOMMatrixReadOnly.rotateFromVector()DOMMatrix.rotateSelf()DOMMatrix.rotateAxisAngleSelf()- CSS の
transformプロパティとrotate3d()関数 - CSS
rotateproperty - CSS 座標変換モジュール
- SVG の
transform属性 CanvasRenderingContext2Dインターフェイスとrotate()メソッド