SVGLength: convertToSpecifiedUnits() method
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
The convertToSpecifiedUnits()
method of the SVGLength
interface allows you to convert the length's value to the specified unit type.
This function will:
- Set the
unitType
property to the given unit type - Update the
valueInSpecifiedUnits
andvalueAsString
properties so the length value is represented in the given unit type
Syntax
js
convertToSpecifiedUnits(unitType)
Parameters
unitType
-
A constant representing the unit type to which the length's value should be converted. This must be one of the constant values defined for the
unitType
property, with the exception ofSVG_LENGTHTYPE_UNKNOWN
.SVGLength.SVG_LENGTHTYPE_NUMBER
: convert to unitless numberSVGLength.SVG_LENGTHTYPE_PERCENTAGE
: convert to percentageSVGLength.SVG_LENGTHTYPE_EMS
: convert to em unitsSVGLength.SVG_LENGTHTYPE_EXS
: convert to ex unitsSVGLength.SVG_LENGTHTYPE_PX
: convert to pixelsSVGLength.SVG_LENGTHTYPE_CM
: convert to centimetersSVGLength.SVG_LENGTHTYPE_MM
: convert to millimetersSVGLength.SVG_LENGTHTYPE_IN
: convert to inchesSVGLength.SVG_LENGTHTYPE_PT
: convert to pointsSVGLength.SVG_LENGTHTYPE_PC
: convert to picas
Return value
None (undefined
).
Examples
Converting a length to mm
js
// Get an SVGLength object
const svg = document.querySelector("svg");
const length = svg.createSVGLength();
// Set a length value in centimeters
length.valueAsString = "0.5cm";
// Convert the length to millimeters
length.convertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_MM);
console.log(length.unitType); // Output: 7 (SVG_LENGTHTYPE_MM)
console.log(length.valueInSpecifiedUnits); // Output: 5
console.log(length.valueAsString); // Output: "5mm"
Specifications
Specification |
---|
Scalable Vector Graphics (SVG) 2 # __svg__SVGLength__convertToSpecifiedUnits |
Browser compatibility
BCD tables only load in the browser