SVGViewTests/w3c/1.1F2/svg/painting-marker-05-f.svg

<svg version="1.1" baseProfile="full" id="svg-root"
  width="100%" height="100%" viewBox="0 0 480 360"
  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  <!--======================================================================-->
  <!--=  SVG 1.1 2nd Edition Test Case                                     =-->
  <!--======================================================================-->
  <!--=  Copyright 2009 World Wide Web Consortium, (Massachusetts          =-->
  <!--=  Institute of Technology, European Research Consortium for         =-->
  <!--=  Informatics and Mathematics (ERCIM), Keio University).            =-->
  <!--=  All Rights Reserved.                                              =-->
  <!--=  See http://www.w3.org/Consortium/Legal/.                          =-->
  <!--======================================================================-->
  <d:SVGTestCase xmlns:d="http://www.w3.org/2000/02/svg/testsuite/description/"
    template-version="1.4" reviewer="DOH" author="ED" status="accepted"
    version="$Revision: 1.7 $" testname="$RCSfile: painting-marker-05-f.svg,v $">
    <d:testDescription xmlns="http://www.w3.org/1999/xhtml" href="http://www.w3.org/TR/SVG11/painting.html#Markers">
        <p>
          Test all the 'overflow' property values except 'inherit' on the 'marker' element.
        </p>
        <p>
          Each column tests a value of the 'overflow' property.
          The first row uses the 'marker' property to set the same marker on start-, mid- and end-points on the path.
          The second row uses 'marker-start', 'marker-mid' and 'marker-end' to give each point its own marker.
          The third row uses the 'marker' property like the first row, but here the marker has orient="auto" set.
        </p>
    </d:testDescription>
    <d:operatorScript xmlns="http://www.w3.org/1999/xhtml">
      <p>
        Run the test. No interaction required.
      </p>
    </d:operatorScript>
    <d:passCriteria xmlns="http://www.w3.org/1999/xhtml">
      <p>
        The test has passed if:

        The columns labeled 'visible' and 'auto' show markers without clipping them.
        All other columns show clipped markers.
        The rendered picture matches the reference image, except for possible
        variations in the labelling text (per CSS2 rules).
      </p>
    </d:passCriteria>
  </d:SVGTestCase>
  <title id="test-title">$RCSfile: painting-marker-05-f.svg,v $</title>
  <defs>
    <font-face font-family="SVGFreeSansASCII" unicode-range="U+0-7F">
      <font-face-src>
        <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/>
      </font-face-src>
    </font-face>
  </defs>
  <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18">
    <defs>
      <marker id="marker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="marker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>
      <marker id="markerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="markerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth">
        <circle cx="5" cy="5" r="7" fill="green" stroke="none"/>
      </marker>
      <marker id="markerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>

      <marker id="vmarker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="visible">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="vmarker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto" overflow="visible">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>
      <marker id="vmarkerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="visible">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="vmarkerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth" overflow="visible">
        <circle cx="5" cy="5" r="7" fill="green" stroke="none"/>
      </marker>
      <marker id="vmarkerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" overflow="visible">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>

      <marker id="amarker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="auto">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="amarker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto" overflow="auto">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>
      <marker id="amarkerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="auto">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="amarkerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth" overflow="auto">
        <circle cx="5" cy="5" r="7" fill="green" stroke="none"/>
      </marker>
      <marker id="amarkerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" overflow="auto">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>

      <marker id="smarker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="scroll">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="smarker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto" overflow="scroll">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>
      <marker id="smarkerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="scroll">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="smarkerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth" overflow="scroll">
        <circle cx="5" cy="5" r="7" fill="green" stroke="none"/>
      </marker>
      <marker id="smarkerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" overflow="scroll">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>

      <marker id="hmarker1" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="hidden">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="hmarker2" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" orient="auto" overflow="hidden">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>
      <marker id="hmarkerStart" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="7.5" refY="7.5" markerUnits="strokeWidth" overflow="hidden">
        <rect width="15" height="15" fill="purple" stroke="none"/>
      </marker>
      <marker id="hmarkerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth" overflow="hidden">
        <circle cx="5" cy="5" r="7" fill="green" stroke="none"/>
      </marker>
      <marker id="hmarkerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="10" refY="10" markerUnits="strokeWidth" overflow="hidden">
        <path d="M 10 0 L 20 20 L 0 20 Z" fill="blue" stroke="none"/>
      </marker>
    </defs>

    <style type="text/css">
      .testpaths {
      fill:none;
      stroke:black;
      stroke-width:8px;
      }

      /* no overflow specified */
      #p1  { marker: url(#marker1); }
      #p2  {
      marker-start: url(#markerStart);
      marker-mid:url(#markerMiddle);
      marker-end: url(#markerEnd);
      }
      #p3  { marker: url(#marker2); }

      /* overflow = visible */
      #p4  { marker: url(#vmarker1); }
      #p5  {
      marker-start: url(#vmarkerStart);
      marker-mid:url(#vmarkerMiddle);
      marker-end: url(#vmarkerEnd);
      }
      #p6  { marker: url(#vmarker2); }

      /* overflow = auto */
      #p7  { marker: url(#amarker1); }
      #p8  {
      marker-start: url(#amarkerStart);
      marker-mid:url(#amarkerMiddle);
      marker-end: url(#amarkerEnd);
      }
      #p9  { marker: url(#amarker2); }

      /* overflow = scroll */
      #p10  { marker: url(#smarker1); }
      #p11  {
      marker-start: url(#smarkerStart);
      marker-mid:url(#smarkerMiddle);
      marker-end: url(#smarkerEnd);
      }
      #p12  { marker: url(#smarker2); }

      /* overflow = hidden */
      #p13  { marker: url(#hmarker1); }
      #p14  {
      marker-start: url(#hmarkerStart);
      marker-mid:url(#hmarkerMiddle);
      marker-end: url(#hmarkerEnd);
      }
      #p15  { marker: url(#hmarker2); }
    </style>

    <text x="50%" y="3em" style="font: 18px SVGFreeSansASCII,sans-serif; text-anchor:middle;">Test marker overflow</text>

    <g style="font: 14px SVGFreeSansASCII,sans-serif; text-anchor:middle" transform="translate(0,280)">
      <text x="60">default</text>
      <text x="155">'visible'</text>
      <text x="245">'auto'</text>
      <text x="340">'scroll'</text>
      <text x="430">'hidden'</text>
    </g>

    <g transform="translate(-30,75)">

      <g id="subtest1" transform="scale(0.6)">
        <path id="p1" class="testpaths" d="M 130 40 L 180 40 L 180 90"/>
        <path id="p2" class="testpaths" d="M 130 135 L 180 135 L 180 185"/>
        <path id="p3" class="testpaths" d="M 130 230 L 180 230 L 180 280"/>
      </g>

      <g id="subtest2" transform="scale(0.6) translate(150,0)">
        <path id="p4" class="testpaths" d="M 130 40 L 180 40 L 180 90"/>
        <path id="p5" class="testpaths" d="M 130 135 L 180 135 L 180 185"/>
        <path id="p6" class="testpaths" d="M 130 230 L 180 230 L 180 280"/>
      </g>

      <g id="subtest3" transform="scale(0.6) translate(300,0)">
        <path id="p7" class="testpaths" d="M 130 40 L 180 40 L 180 90"/>
        <path id="p8" class="testpaths" d="M 130 135 L 180 135 L 180 185"/>
        <path id="p9" class="testpaths" d="M 130 230 L 180 230 L 180 280"/>
      </g>

      <g id="subtest4" transform="scale(0.6) translate(450,0)">
        <path id="p10" class="testpaths" d="M 130 40 L 180 40 L 180 90"/>
        <path id="p11" class="testpaths" d="M 130 135 L 180 135 L 180 185"/>
        <path id="p12" class="testpaths" d="M 130 230 L 180 230 L 180 280"/>
      </g>

      <g id="subtest5" transform="scale(0.6) translate(600,0)">
        <path id="p13" class="testpaths" d="M 130 40 L 180 40 L 180 90"/>
        <path id="p14" class="testpaths" d="M 130 135 L 180 135 L 180 185"/>
        <path id="p15" class="testpaths" d="M 130 230 L 180 230 L 180 280"/>
      </g>
    </g>
  </g>
  <g font-family="SVGFreeSansASCII,sans-serif" font-size="32">
    <text id="revision" x="10" y="340" stroke="none" fill="black">$Revision: 1.7 $</text>
  </g>
  <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/>
  <!-- comment out this watermark once the test is approved -->
  <!--<g id="draft-watermark">
    <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/>
    <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240"
      text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text>
  </g>-->
</svg>