| <?xml version="1.0" standalone="no"?> |
| <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20000802//EN" |
| "http://www.w3.org/TR/2000/CR-SVG-20000802/DTD/svg-20000802.dtd"> |
| |
| <!-- ========================================================================= --> |
| <!-- Copyright (C) The Apache Software Foundation. All rights reserved. --> |
| <!-- --> |
| <!-- This software is published under the terms of the Apache Software License --> |
| <!-- version 1.1, a copy of which has been included with this distribution in --> |
| <!-- the LICENSE file. --> |
| <!-- ========================================================================= --> |
| |
| <!-- ========================================================================= --> |
| <!-- This test shows the various shapes that can have markers. --> |
| <!-- --> |
| <!-- @author vhardy@apache.org --> |
| <!-- @version $Id$ --> |
| <!-- ========================================================================= --> |
| <?xml-stylesheet type="text/css" href="test.css" ?> |
| |
| <svg id="body" width="450" height="500" viewBox="0 0 450 500"> |
| <title>Marker Test</title> |
| |
| <g id="content"> |
| |
| <text class="title" x="50%" y="40">Markers, Shape Test</text> |
| |
| <defs> |
| <radialGradient id="whiteSphere" gradientUnits="objectBoundingBox" cx=".25" cy=".25" r=".8"> |
| <stop offset="0" stop-color="white" /> |
| <stop offset=".5" stop-color="rgb(230, 230, 230)" /> |
| <stop offset=".8" stop-color="rgb(128, 128, 128)" /> |
| <stop offset="1.4" stop-color="black" /> |
| </radialGradient> |
| |
| <radialGradient id="graySphere" gradientUnits="objectBoundingBox" cx=".25" cy=".25" r=".8"> |
| <stop offset="0" stop-color="white" /> |
| <stop offset=".8" stop-color="rgb(40, 40, 40)" /> |
| <stop offset="1.4" stop-color="black" /> |
| </radialGradient> |
| |
| <radialGradient id="blackSphere" gradientUnits="objectBoundingBox" cx=".25" cy=".25" r=".8"> |
| <stop offset="0" stop-color="white" /> |
| <stop offset=".2" stop-color="rgb(40, 40, 40)" /> |
| <stop offset="1.4" stop-color="black" /> |
| </radialGradient> |
| |
| <filter id="shadow" x="-1" y="-.2" width="2.8" height="1.4" |
| primitiveUnits="objectBoundingBox"> |
| <feGaussianBlur stdDeviation="1 1" in="SourceAlpha"/> |
| <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 .5 0" /> |
| <feOffset dx="2" dy="2" result="offset"/> |
| <feMerge> |
| <feMergeNode in="offset" /> |
| <feMergeNode in="SourceGraphic" /> |
| </feMerge> |
| </filter> |
| |
| <!-- ============================= --> |
| <!-- Simple Marker Definition --> |
| <!-- ============================= --> |
| <marker id="startMarker" markerWidth="4" markerHeight="4" |
| viewBox="0 0 100 100" orient="0" refX="50" refY="50" |
| markerUnits="strokeWidth"> |
| <circle cx="50" cy="50" r="50" fill="url(#whiteSphere)" stroke="none"/> |
| </marker> |
| |
| <marker id="midMarker" markerWidth="4" markerHeight="4" |
| viewBox="0 0 100 100" orient="0" refX="50" refY="50" |
| markerUnits="strokeWidth"> |
| <circle cx="50" cy="50" r="50" fill="url(#graySphere)" stroke="none"/> |
| </marker> |
| |
| <marker id="endMarker" markerWidth="4" markerHeight="4" |
| viewBox="0 0 100 100" orient="0" refX="50" refY="50" |
| markerUnits="strokeWidth"> |
| <circle cx="50" cy="50" r="50" fill="url(#blackSphere)" stroke="none"/> |
| </marker> |
| |
| </defs> |
| |
| <!-- ==================================== --> |
| <!-- Path with marker --> |
| <!-- ==================================== --> |
| <g transform="translate(130, 120)" > |
| <path fill="none" stroke="black" stroke-width="2" d="M 0 0 q 10 0 10 10 l -10 10 q 10 0 10 10 |
| l -10 10 q 10 0 10 10 l -10 10 q 10 0 10 10 l -10 10" |
| marker-start="url(#startMarker)" |
| marker-mid="url(#midMarker)" |
| marker-end="url(#endMarker)" |
| filter="url(#shadow)" |
| transform="scale(3, 3)" /> |
| <text x="15" y="280" text-anchor="middle" class="label"><path></text> |
| </g> |
| |
| <!-- ==================================== --> |
| <!-- Line with marker --> |
| <!-- ==================================== --> |
| <g transform="translate(50, 120)" filter="url(#shadow)" > |
| <rect x="-10" y="-10" width="20" height="260" fill="none" stroke="none"/> |
| <line stroke="black" stroke-width="6" x1="0" y1="0" x2="0" y2="240" |
| marker-start="url(#startMarker)" |
| marker-mid="url(#midMarker)" |
| marker-end="url(#endMarker)" |
| /> |
| <text x="0" y="280" text-anchor="middle" class="label"><line></text> |
| </g> |
| |
| <!-- ==================================== --> |
| <!-- Polyline with marker --> |
| <!-- ==================================== --> |
| <g transform="translate(240, 120)" > |
| <polyline fill="none" stroke="black" stroke-width="2" points="0,0 10,10 0,20 10,30 0,40 10,50 0,60 10,70 0,80 " |
| marker-start="url(#startMarker)" |
| marker-mid="url(#midMarker)" |
| marker-end="url(#endMarker)" filter="url(#shadow)" transform="scale(3, 3)" /> |
| <text x="0" y="280" text-anchor="middle" class="label"><polyline></text> |
| </g> |
| |
| <!-- ==================================== --> |
| <!-- Polygon with marker --> |
| <!-- ==================================== --> |
| <g transform="translate(380, 120)" > |
| <polygon fill="none" stroke="black" stroke-width="2" |
| points="0,0 10,10 0,20 10,30 0,40 10,50 0,60 10,70 0,80 |
| -20,80 -10,70 -20,60 -10,50 -20,40 -10,30 -20,20 -10,10 -20,0" |
| marker-start="url(#startMarker)" |
| marker-mid="url(#midMarker)" |
| marker-end="url(#endMarker)" filter="url(#shadow)" transform="scale(3, 3)" /> |
| <text x="-20" y="280" text-anchor="middle" class="label"><polygon></text> |
| </g> |
| |
| |
| </g> |
| |
| <!-- ============================================================= --> |
| <!-- Batik sample mark --> |
| <!-- ============================================================= --> |
| <use xlink:href="../batikLogo.svg#Batik_Tag_Box" /> |
| |
| </svg> |
