SVGMarkerElement

此接口还从其父接口 SVGElement 继承属性。

SVGMarkerElement.markerUnits 只读

返回一个 SVGAnimatedEnumeration 对象，其中包含以下值之一

0

SVG_MARKERUNITS_UNKNOWN 表示 markerUnits 属性的值与两个预定义的关键字不同。

1

SVG_MARKERUNITS_USERSPACEONUSE 表示 markerUnits 属性具有关键字值 userSpaceOnUse。

2

SVG_MARKERUNITS_STROKEWIDTH 表示 markerUnits 属性具有关键字值 strokeWidth。

SVGMarkerElement.markerWidth 只读

返回一个 SVGAnimatedLength 对象，其中包含 <marker> 视窗的宽度。

SVGMarkerElement.markerHeight 只读

返回一个 SVGAnimatedLength 对象，其中包含 <marker> 视窗的高度。

SVGMarkerElement.orientType 只读

返回一个 SVGAnimatedEnumeration 对象，其中包含以下值之一

0

SVG_MARKER_ORIENT_UNKNOWN 表示 orient 属性的值与两个预定义的关键字不同。

1

SVG_MARKERUNITS_ORIENT_AUTO 表示 orient 属性具有关键字值 auto。

2

SVG_MARKERUNITS_ORIENT_ANGLE 表示 orient 属性具有一个 <angle> 或 <number> 值，表示角度。

SVGMarkerElement.orientAngle 只读

返回一个 SVGAnimatedAngle 对象，其中包含 orient 属性的角度。

SVGMarkerElement.refX 只读

返回一个 SVGAnimatedLength 对象，其中包含 <marker> 的 refX 属性的值。

SVGMarkerElement.refY 只读

返回一个 SVGAnimatedLength 对象，其中包含 <marker> 的 refY 属性的值。

SVGMarkerElement.viewBox 只读

返回一个 SVGAnimatedRect 对象，其中包含一个 SVGRect，该对象包含 <marker> 上 viewBox 属性设置的值。

SVGMarkerElement.preserveAspectRatio 只读

返回一个 SVGPreserveAspectRatio 对象，其中包含 <marker> 视窗上 preserveAspectRatio 属性设置的值。

此接口还从其父接口 SVGElement 继承函数。

SVGMarkerElement.setOrientToAuto()

将 orient 属性的值设置为 auto。

SVGMarkerElement.setOrientToAngle()

将 orient 属性的值设置为特定角度值。

以下 SVG 将在示例中引用。

<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="90">
      <path d="M 0 0 L 10 5 L 0 10 z" />
    </marker>
  </defs>
</svg>

markerWidth 属性返回一个 SVGAnimatedLength，其中包含一个 SVGLength，其值为 markerWidth 属性。

let marker = document.getElementById("arrow");
console.log(marker.markerWidth.baseVal.value); // 6

在以下示例中，orient 属性的值使用 setOrientToAngle() 更新，该函数使用一个通过 SVGElement.createSVGAngle() 创建的 SVGAngle。

let svg = document.getElementById("svg");
let marker = document.getElementById("arrow");
console.log(marker.orientAngle.baseVal.value); // value in SVG above - 90
let angle = svg.createSVGAngle();
angle.value = "110";
marker.setOrientToAngle(angle);
console.log(marker.orientAngle.baseVal.value); // new value - 110