dynamic-marker-03.svg

Enable keyboard shortcuts

Checkerboard

<!--

     Any copyright is dedicated to the Public Domain.

     http://creativecommons.org/publicdomain/zero/1.0/

-->

<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">

  <title>Testing that dynamic changes to preserveAspectRatio are reflected in the marker</title>

  <script>

<![CDATA[

document.addEventListener("MozReftestInvalidate", doTest, false);

setTimeout(doTest, 4000); // fallback for running outside reftest

function doTest() {

  m = document.getElementById("m1");

  m.preserveAspectRatio.baseVal.align =

    SVGPreserveAspectRatio.SVG_PRESERVEASPECTRATIO_NONE;

  document.documentElement.removeAttribute("class");

document.addEventListener("MozReftestInvalidate", doTest, false);

setTimeout(doTest, 4000); // fallback for running outside reftest

]]>

  </script>

  <defs>

    <marker id="m1" orient="auto" markerUnits="userSpaceOnUse"

      preserveAspectRatio="xMidYMid slice" viewBox="0 0 30 40" markerWidth="60" markerHeight="30">

      <rect width="30" height="40" fill="red"/>

    </marker>

  </defs>

  <rect width="100%" height="100%" fill="lime"/>

  <line x1="30" x2="30" y1="10" y2="10" stroke="red" stroke-width="3" marker-end="url(#m1)"/>

  <rect x="30" y="10" width="60" height="30" fill="lime"/>

</svg>