vhardy 01/08/03 09:20:47 Added: samples/tests anchor.svg tde.jpg tke.jpg toolTips.svg Log: Added test case for <a> illustrating bug on anchor on image. Added test case on tooltips in preparation of work on <title> and <desc> showing toolTips. Revision Changes Path 1.1 xml-batik/samples/tests/anchor.svg Index: anchor.svg =================================================================== <?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 interactive test validates that the <anchor> tag works on the --> <!-- various element types. --> <!-- --> <!-- @author [EMAIL PROTECTED] --> <!-- @version $Id: anchor.svg,v 1.1 2001/08/03 16:20:47 vhardy Exp $ --> <!-- ========================================================================= --> <?xml-stylesheet type="text/css" href="test.css" ?> <svg id="body" width="450" height="500" viewBox="0 0 450 500"> <title>Marker Test</title> <style type="text/css"><![CDATA[ .label { text-anchor: middle; } ]]></style> <g id="content"> <text class="title" x="50%" y="40">Anchor <a> Test <desc>Click in any of the links in the table. You should see a smilley.</desc></text> <defs> <g id="smilley"> <g transform="scale(.8, .8) translate(-15,-15)"> <circle cx="15" cy="15" r="10"/> <circle cx="12" cy="12" r="1.5" fill="black"/> <circle cx="17" cy="12" r="1.5" fill="black"/> <path d="M 10 19 A 8 8 0 0 0 20 19" stroke="black" stroke-width="1"/> </g> </g> <g id="success" fill="rgb(0,255,0)"> <use xlink:href="#smilley" /> </g> </defs> <g transform="translate(5, 5) scale(.2)"> <use xlink:href="#success"/> <a xlink:href="#svgView(viewBox(0,0,450,500))"> <text y="-11" font-size="2" fill="blue" text-decoration="underline" text-anchor="middle">Return to test</text> </a> </g> <g id="graphicsElementsTable" transform="translate(165, 80)"> <g id="additionalInfoHeader" transform="translate(60, 0)"> <rect x="0" y="0" width="60" height="20" fill="#eeeeee" stroke="black" /> <g id="additionalInfoHeaderLabels" transform="translate(0, 15)" class="label"> <text x="30" y="0">Link</text> </g> </g> <g id="rectRow" transform="translate(0, 20)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><rect></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <rect id="testRect" x="80" y="3" fill="gold" width="20" height="14" /> </a> </g> <!-- "rectRow" --> <g id="circleRow" transform="translate(0, 40)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><circle></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <circle id="testCircle" cx="90" cy="10" r="8" fill="crimson" width="20" height="14" /> </a> </g> <!-- "circleRow" --> <g id="ellipseRow" transform="translate(0, 60)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><ellipse></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <ellipse cx="90" cy="10" rx="20" ry="6" fill="gold" /> </a> </g> <!-- "ellipseRow" --> <g id="lineRow" transform="translate(0, 80)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><line></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <line x1="70" y1="10" x2="110" y2="10" stroke="gold" stroke-width="4" /> </a> </g> <!-- "lineRow" --> <g id="polylineRow" transform="translate(0, 100)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><polyline></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <polyline transform="translate(60, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10" fill="none" stroke="gold" stroke-width="4" /> </a> </g> <!-- "polylineRow" --> <g id="polygonRow" transform="translate(0, 120)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><polygon></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <polygon transform="translate(60, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10" fill="gold" stroke="black" stroke-width="1" /> </a> </g> <!-- "polygonRow" --> <g id="pathRow" transform="translate(0, 140)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><path></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <path transform="translate(60, 0)" d="M5,10l0,5l25,0l0,-10l25,0l0,5Z" fill="gold" stroke="black" stroke-width="1" /> </a> </g> <!-- "pathRow" --> <g id="imageRow" transform="translate(0, 160)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><image></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <image transform="translate(60, 0)" x="8" y="2" width="43" height="18" xlink:href="tke.jpg"/> </a> </g> <!-- "imageRow" --> <g id="svgImageRow" transform="translate(0, 180)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><image></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <image transform="translate(60, 0)" x="20" y="2" width="24" height="18" xlink:href="svg.svg"/> </a> </g> <!-- "svgImageRow" --> <g id="textRow" transform="translate(0, 200)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><text></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <text transform="translate(60, 0)" x="30" y="15" text-anchor="middle">Ho, la, la!</text> </a> </g> <!-- "textRow" --> <g id="useRow" transform="translate(0, 220)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><use></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <use xlink:href="#testRect" /> </a> </g> <!-- "useRow" --> <g id="groupRow" transform="translate(0, 240)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><g></text> <a xlink:href="#svgView(viewBox(3,2.5,4,4))"> <g> <use xlink:href="#testRect" /> <use xlink:href="#testCircle" transform="translate(10, 0)"/> </g> </a> </g> <!-- "groupRow" --> </g> </g><!-- "content" --> <!-- ============================================================= --> <!-- Batik sample mark --> <!-- ============================================================= --> <use xlink:href="../batikLogo.svg#Batik_Tag_Box" /> </svg> 1.1 xml-batik/samples/tests/tde.jpg <<Binary file>> 1.1 xml-batik/samples/tests/tke.jpg <<Binary file>> 1.1 xml-batik/samples/tests/toolTips.svg Index: toolTips.svg =================================================================== <?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 validates handling of the title and desc elements on graphical --> <!-- elements. By default, the JSVGCanvas shows a tooltip with the title and --> <!-- description if present. --> <!-- This test validates that tooltips are shown on the various graphical --> <!-- elements and that overlapping elements are treated properly (i.e., that --> <!-- tooltips do not 'show through' elements. --> <!-- --> <!-- @author [EMAIL PROTECTED] --> <!-- @version $Id: toolTips.svg,v 1.1 2001/08/03 16:20:47 vhardy Exp $ --> <!-- ========================================================================= --> <?xml-stylesheet type="text/css" href="test.css" ?> <svg id="body" width="450" height="500" viewBox="0 0 450 500"> <title>Marker Test</title> <style type="text/css"><![CDATA[ .label { text-anchor: middle; } ]]></style> <g id="content"> <text class="title" x="50%" y="40"><title>and <desc></text> <text class="title" x="50%" y="55">tool tips on Graphical Elements</text> <defs> </defs> <g id="graphicsElementsTable" transform="translate(75, 80)"> <g id="additionalInfoHeader" transform="translate(60, 0)"> <rect x="0" y="0" width="60" height="20" fill="#eeeeee" stroke="black" /> <rect x="60" y="0" width="60" height="20" fill="#eeeeee" stroke="black" /> <rect x="120" y="0" width="60" height="20" fill="#eeeeee" stroke="black" /> <rect x="180" y="0" width="60" height="20" fill="#eeeeee" stroke="black" /> <g id="additionalInfoHeaderLabels" transform="translate(0, 15)" class="label"> <text x="30" y="0">No info</text> <text x="90" y="0"><title></text> <text x="150" y="0"><desc></text> <text x="210" y="0">both</text> </g> </g> <g id="rectRow" transform="translate(0, 20)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> <rect x="120" y="0" width="60" height="20" /> <rect x="180" y="0" width="60" height="20" /> <rect x="240" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><rect></text> <g id="rectSamples" fill="gold" stroke="black"> <!-- No info --> <rect transform="translate(60, 0)" x="20" y="3" width="20" height="14" /> <!-- title --> <rect transform="translate(120, 0)" x="20" y="3" width="20" height="14" > <title><rect> with title only</title> </rect> <!-- desc --> <rect transform="translate(180, 0)" x="20" y="3" width="20" height="14"> <desc><rect> with <desc> only</desc> </rect> <!-- title and desc --> <rect transform="translate(240, 0)" x="20" y="3" width="20" height="14"> <title>Title: <rect> with title and <desc></title> <desc>Description: <rect> with title and <desc></desc> </rect> </g> </g> <!-- "rectRow" --> <g id="circleRow" transform="translate(0, 40)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> <rect x="120" y="0" width="60" height="20" /> <rect x="180" y="0" width="60" height="20" /> <rect x="240" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><circle></text> <g id="circleSamples" fill="gold" stroke="black"> <!-- No info --> <circle transform="translate(60, 0)" cx="30" cy="10" r="8" /> <!-- title --> <circle transform="translate(120, 0)" cx="30" cy="10" r="8" > <title><circle> with <title> only</title> </circle> <!-- desc --> <circle transform="translate(180, 0)" cx="30" cy="10" r="8" > <desc><circle> with <desc> only</desc> </circle> <!-- title and desc --> <circle transform="translate(240, 0)" cx="30" cy="10" r="8" > <title>Title: <circle> with <title> and <desc></title> <desc>Description: <circle> with <desc> and <desc></desc> </circle> </g> </g> <!-- "circleRow" --> <g id="ellipseRow" transform="translate(0, 60)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> <rect x="120" y="0" width="60" height="20" /> <rect x="180" y="0" width="60" height="20" /> <rect x="240" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><ellipse></text> <g id="ellipseSamples" fill="gold" stroke="black"> <!-- No info --> <ellipse transform="translate(60, 0)" cx="30" cy="10" rx="20" ry="5" /> <!-- title --> <ellipse transform="translate(120, 0)" cx="30" cy="10" rx="20" ry="5" > <title><ellipse> with <title> only</title> </ellipse> <!-- desc --> <ellipse transform="translate(180, 0)" cx="30" cy="10" rx="20" ry="5" > <desc><ellipse> with <desc> only</desc> </ellipse> <!-- title and desc --> <ellipse transform="translate(240, 0)" cx="30" cy="10" rx="20" ry="5" > <title>Title: <ellipse> with <title> and <desc></title> <desc>Description: <ellipse> with <desc> and <desc></desc> </ellipse> </g> </g> <!-- "ellipseRow" --> <g id="lineRow" transform="translate(0, 80)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> <rect x="120" y="0" width="60" height="20" /> <rect x="180" y="0" width="60" height="20" /> <rect x="240" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><line></text> <g id="lineSamples" stroke="black" stroke-width="4"> <!-- No info --> <line transform="translate(60, 0)" x1="5" y1="10" x2="55" y2="10" /> <!-- title --> <line transform="translate(120, 0)" x1="5" y1="10" x2="55" y2="10" > <title><line> with <title> only</title> </line> <!-- desc --> <line transform="translate(180, 0)" x1="5" y1="10" x2="55" y2="10" > <desc><line> with <desc> only</desc> </line> <!-- title and desc --> <line transform="translate(240, 0)" x1="5" y1="10" x2="55" y2="10" > <title>Title: <line> with <title> and <desc></title> <desc>Description: <line> with <desc> and <desc></desc> </line> </g> </g> <!-- "lineRow" --> <g id="polylineRow" transform="translate(0, 100)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> <rect x="120" y="0" width="60" height="20" /> <rect x="180" y="0" width="60" height="20" /> <rect x="240" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><polyline></text> <g id="polylineSamples" stroke="black" fill="orange"> <!-- No info --> <polyline transform="translate(60, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10"/> <!-- title --> <polyline transform="translate(120, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10"> <title><polyline> with <title> only</title> </polyline> <!-- desc --> <polyline transform="translate(180, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10"> <desc><polyline> with <desc> only</desc> </polyline> <!-- title and desc --> <polyline transform="translate(240, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10"> <title>Title: <polyline> with <title> and <desc></title> <desc>Description: <polyline> with <desc> and <desc></desc> </polyline> </g> </g> <!-- "polylineRow" --> <g id="polygonRow" transform="translate(0, 120)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> <rect x="120" y="0" width="60" height="20" /> <rect x="180" y="0" width="60" height="20" /> <rect x="240" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><polygon></text> <g id="polygonSamples" stroke="black" fill="orange"> <!-- No info --> <polygon transform="translate(60, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10"/> <!-- title --> <polygon transform="translate(120, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10"> <title><polygon> with <title> only</title> </polygon> <!-- desc --> <polygon transform="translate(180, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10"> <desc><polygon> with <desc> only</desc> </polygon> <!-- title and desc --> <polygon transform="translate(240, 0)" points="5,10 5,15 30,15 30,5 55,5 55,10"> <title>Title: <polygon> with <title> and <desc></title> <desc>Description: <polygon> with <desc> and <desc></desc> </polygon> </g> </g> <!-- "polygonRow" --> <g id="pathRow" transform="translate(0, 140)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> <rect x="120" y="0" width="60" height="20" /> <rect x="180" y="0" width="60" height="20" /> <rect x="240" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><path></text> <g id="pathSamples" stroke="black" fill="orange"> <!-- No info --> <path transform="translate(60, 0)" d="M5,10l0,5l25,0l0,-10l25,0l0,5Z"/> <!-- title --> <path transform="translate(120, 0)" d="M5,10l0,5l25,0l0,-10l25,0l0,5Z"> <title><path> with <title> only</title> </path> <!-- desc --> <path transform="translate(180, 0)" d="M5,10l0,5l25,0l0,-10l25,0l0,5Z"> <desc><path> with <desc> only</desc> </path> <!-- title and desc --> <path transform="translate(240, 0)" d="M5,10l0,5l25,0l0,-10l25,0l0,5Z"> <title>Title: <path> with <title> and <desc></title> <desc>Description: <path> with <desc> and <desc></desc> </path> </g> </g> <!-- "pathRow" --> <g id="imageRow" transform="translate(0, 160)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> <rect x="120" y="0" width="60" height="20" /> <rect x="180" y="0" width="60" height="20" /> <rect x="240" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><image></text> <g id="imageSamples" stroke="black" fill="orange"> <!-- No info --> <image transform="translate(60, 0)" x="8" y="2" width="43" height="18" xlink:href="tde.jpg"/> <!-- title --> <image transform="translate(120, 0)" x="8" y="2" width="43" height="18" xlink:href="tke.jpg"> <title><image> with <title> only</title> </image> <!-- desc --> <image transform="translate(180, 0)" x="8" y="2" width="43" height="18" xlink:href="tde.jpg"> <desc><image> with <desc> only</desc> </image> <!-- title and desc --> <image transform="translate(240, 0)" x="8" y="2" width="43" height="18" xlink:href="tke.jpg"> <title>Title: <image> with <title> and <desc></title> <desc>Description: <image> with <desc> and <desc></desc> </image> </g> </g> <!-- "imageRow" --> <g id="textRow" transform="translate(0, 180)"> <g fill="white" stroke="black"> <rect x="0" y="0" width="60" height="20" /> <rect x="60" y="0" width="60" height="20" /> <rect x="120" y="0" width="60" height="20" /> <rect x="180" y="0" width="60" height="20" /> <rect x="240" y="0" width="60" height="20" /> </g> <text x="30" y="15" class="label"><text></text> <g id="textSamples" stroke="none" fill="crimson" text-anchor="middle"> <!-- No info --> <text transform="translate(60, 0)" x="30" y="15">Ho, la, la!</text> <!-- title --> <text transform="translate(120, 0)" x="30" y="15">Ho, la, la! <title><text> with <title> only</title> </text> <!-- desc --> <text transform="translate(180, 0)" x="30" y="15">Ho, la, la! <desc><text> with <desc> only</desc> </text> <!-- title and desc --> <text transform="translate(240, 0)" x="30" y="15">Ho, la, la! <title>Title: <text> with <title> and <desc></title> <desc>Description: <text> with <desc> and <desc></desc> </text> </g> </g> <!-- "textRow" --> </g> <!-- id="graphicsElementsTable" --> <g id="toolTipOverlaps" transform="translate(75, 300)"> <g fill="#eeeeee" stroke="black"> <rect x="60" width="120" height="20" /> <rect x="180" width="120" height="20" /> <rect x="40" y="20" width="20" height="80" /> <rect x="40" y="100" width="20" height="80" /> <rect y="20" x="60" width="120" height="80" fill="white" /> <rect y="100" x="60" width="120" height="80" fill="white" /> <rect y="20" x="180" width="120" height="80" fill="white" /> <rect y="100" x="180" width="120" height="80" fill="white" /> <g class="label" stroke="none" fill="black"> <text x="120" y="15">Orange w/ Tip</text> <text x="240" y="15">Orange wo/ Tip</text> <text transform="rotate(-90, 55, 60)" x="55" y="60">Red w/Tip</text> <text transform="rotate(-90, 55, 140)" x="55" y="140">Red wo/Tip</text> </g> <!-- ============================== --> <!-- Top Left --> <!-- red w tip, --> <!-- orange w tip. --> <!-- Tip on red and orange. Orange --> <!-- tip on intersection. --> <!-- ============================== --> <g transform="translate(60, 20)"> <rect x="10" y="10" width="50" height="50" fill="crimson"> <title>Red <rect> with tip</title> </rect> <rect x="30" y="30" width="80" height="40" fill="orange"> <title>Orange <rect> with tip</title> </rect> </g> <!-- ============================== --> <!-- Top Right. --> <!-- red w tip, --> <!-- orange wo tip. --> <!-- Tip on red. No tip on orange. --> <!-- No tip on intersection. --> <!-- ============================== --> <g transform="translate(180, 20)"> <rect x="10" y="10" width="50" height="50" fill="crimson"> <title>Red <rect> with tip</title> </rect> <rect x="30" y="30" width="80" height="40" fill="orange" /> </g> <!-- ============================== --> <!-- Bottom Left --> <!-- red wo tip, --> <!-- orange w tip. --> <!-- No tip on red. Tip on orange. --> <!-- Orange tip on intersection. --> <!-- ============================== --> <g transform="translate(60, 100)"> <rect x="10" y="10" width="50" height="50" fill="crimson"/> <rect x="30" y="30" width="80" height="40" fill="orange"> <title>Orange <rect> with tip</title> </rect> </g> <!-- ============================== --> <!-- Bottom Right. --> <!-- red wo tip, --> <!-- orange wo tip. --> <!-- There should be no tooltips --> <!-- shown. --> <!-- ============================== --> <g transform="translate(180, 100)"> <rect x="10" y="10" width="50" height="50" fill="crimson"/> <rect x="30" y="30" width="80" height="40" fill="orange"/> </g> </g> </g> </g><!-- "content" --> <!-- ============================================================= --> <!-- Batik sample mark --> <!-- ============================================================= --> <use xlink:href="../batikLogo.svg#Batik_Tag_Box" /> </svg> --------------------------------------------------------------------- To unsubscribe, e-mail: [EMAIL PROTECTED] For additional commands, e-mail: [EMAIL PROTECTED]
