The markerUnits
read-only property of the SVGMarkerElement
interface returns an SVGAnimatedEnumeration
object. This object returns an integer which represents the keyword values that the markerUnits
attribute accepts.
The markerUnits
read-only property of the SVGMarkerElement
interface returns an SVGAnimatedEnumeration
object. This object returns an integer which represents the keyword values that the markerUnits
attribute accepts.
An SVGAnimatedEnumeration
object. The baseVal
property of this object contains one of the following values:
0
SVG_MARKERUNITS_UNKNOWN
which means that the markerUnits
attribute has a value other than the two predefined keywords.
1
SVG_MARKERUNITS_USERSPACEONUSE
which means that the markerUnits
attribute has the keyword value userSpaceOnUse
.
2
SVG_MARKERUNITS_STROKEWIDTH
which means that the markerUnits
attribute has the keyword value strokeWidth
.
The markerUnits
property returns an SVGAnimatedEnumeration
object that contains the value of the markerUnits
attribute.
html
<svg id="svg" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <defs> <marker id="arrow" viewBox="0 0 10 10" refX="5" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse" markerUnits="strokeWidth"> <path d="M 0 0 L 10 5 L 0 10 z" /> </marker> </defs> </svg>
js
let marker = document.getElementById("arrow"); console.log(marker.markerUnits.baseVal); // 2
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
markerUnits |
1 | 12 | 1.5 | 9 | ≤12.1 | 3 | 3 | 18 | 4 | ≤12.1 | 1 | 1.0 |
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/SVGMarkerElement/markerUnits