SVGAngle: newValueSpecifiedUnits() メソッド
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
newValueSpecifiedUnits() は SVGAngle インターフェイスのメソッドで、関連付けられた unitType を持つ数値に値を設定し、それによってオブジェクト上のすべての属性の値を置き換えます。
構文
js
newValueSpecifiedUnits(unitType, valueInSpecifiedUnits)
引数
unitType-
角度値を変換する単位型を表す定数です。 これは、
unitTypeプロパティに対して定義された定数値のいずれかでなければならず、SVG_ANGLETYPE_UNKNOWNは例外となります。SVGAngle.SVG_ANGLETYPE_DEG: 度に変換SVGAngle.SVG_ANGLETYPE_RAD: ラジアンに変換SVGAngle.SVG_ANGLETYPE_GRAD: グラードに変換SVGAngle.SVG_ANGLETYPE_UNSPECIFIED: 単位なしの値に変換、度として解釈される
valueInSpecifiedUnits-
角度値の数値係数で、指定した単位型で表します。
返値
なし (undefined)。
例外
このメソッドは、次のいずれかの型の DOMException を発生させる可能性があります。
NotSupportedErrorDOMException-
unitTypeがSVG_ANGLETYPE_UNKNOWNであるか、有効な単位型定数でない場合に発生します。 NoModificationAllowedErrorDOMException-
SVGAngleが読み取り専用の属性に関連付けられている場合、またはオブジェクト自体が読み取り専用である場合に発生します。
例
角度を度で設定
js
// SVGAngle オブジェクトを取得
const svg = document.querySelector("svg");
const angle = svg.createSVGAngle();
// newValueSpecifiedUnits() を使用して角度の値を度単位で設定
angle.newValueSpecifiedUnits(SVGAngle.SVG_ANGLETYPE_DEG, 45);
// 角度の値を度単位で受け取る
console.log(angle.value); // 出力: 45
console.log(angle.unitType); // 出力: 2 (SVG_ANGLETYPE_DEG)
角度をラジアンで設定
js
// SVGAngle オブジェクトを取得
const svg = document.querySelector("svg");
const angle = svg.createSVGAngle();
// newValueSpecifiedUnits() を使用して角度の値をラジアンで設定
angle.newValueSpecifiedUnits(SVGAngle.SVG_ANGLETYPE_RAD, Math.PI / 2);
// 角度の値を受け取る
console.log(angle.value); // 出力: 90
console.log(angle.unitType); // 出力: 3 (SVG_ANGLETYPE_RAD)
角度をグラードで設定
js
// SVGAngle オブジェクトを取得
const svg = document.querySelector("svg");
const angle = svg.createSVGAngle();
// newValueSpecifiedUnits() を使用して角度の値をグラードで設定
angle.newValueSpecifiedUnits(SVGAngle.SVG_ANGLETYPE_GRAD, 100);
// 角度の値をグラードで受け取る
console.log(angle.value); // 出力: 90
console.log(angle.unitType); // 出力: 4 (SVG_ANGLETYPE_GRAD)
仕様書
| Specification |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGAngle__newValueSpecifiedUnits |
ブラウザーの互換性
Loading…