coords-dom-04-f-isvalid.html (5584B)
1 <!DOCTYPE html> 2 <html lang='en'> 3 <head> 4 <title>coords-dom-04-f-manual.svg</title> 5 <meta charset='utf-8'> 6 </head> 7 <body> 8 <h1>Source SVG: coords-dom-04-f-manual.svg</h1> 9 <svg id="svg-root" width="100%" height="100%" 10 viewBox="0 0 480 360" xmlns="http://www.w3.org/2000/svg" 11 xmlns:xlink="http://www.w3.org/1999/xlink" onload="test()"> 12 <!--======================================================================--> 13 <!--= Copyright 2008 World Wide Web Consortium, (Massachusetts =--> 14 <!--= Institute of Technology, European Research Consortium for =--> 15 <!--= Informatics and Mathematics (ERCIM), Keio University). =--> 16 <!--= All Rights Reserved. =--> 17 <!--= See http://www.w3.org/Consortium/Legal/. =--> 18 <!--======================================================================--> 19 20 <title id="test-title">$RCSfile: coords-dom-04-f.svg,v $</title> 21 <defs> 22 <font-face 23 font-family="SVGFreeSansASCII" 24 unicode-range="U+0-7F"> 25 <font-face-src> 26 <font-face-uri xlink:href="../resources/SVGFreeSans.svg#ascii"/> 27 </font-face-src> 28 </font-face> 29 </defs> 30 <g id="test-body-content" font-family="SVGFreeSansASCII,sans-serif" font-size="18"> 31 <defs> 32 <style> 33 #test-body-content rect { stroke: black; } 34 </style> 35 <script type="text/ecmascript"><![CDATA[ 36 var pos = { "x": 20, "y": 40 }; 37 var subtestCounter = 1; 38 var passed = true; 39 40 function toString(m) 41 { 42 var decimals = 0; 43 return m.a.toFixed(decimals) + "," + 44 m.b.toFixed(decimals) + "," + 45 m.c.toFixed(decimals) + "," + 46 m.d.toFixed(decimals) + "," + 47 m.e.toFixed(decimals) + "," + 48 m.f.toFixed(decimals); 49 } 50 51 function referenceEqual(m1,ref,eps) 52 { 53 return (Math.abs(m1.a-ref[0]) < eps && 54 Math.abs(m1.b-ref[1]) < eps && 55 Math.abs(m1.c-ref[2]) < eps && 56 Math.abs(m1.d-ref[3]) < eps && 57 Math.abs(m1.e-ref[4]) < eps && 58 Math.abs(m1.f-ref[5]) < eps); 59 } 60 61 function assertEquals(m, ref, eps) 62 { 63 var result = document.createElementNS("http://www.w3.org/2000/svg", "text"); 64 var resultrect = document.createElementNS("http://www.w3.org/2000/svg", "rect"); 65 result.setAttribute("x", pos.x); 66 result.setAttribute("y", pos.y); 67 resultrect.setAttribute("fill", "lime"); 68 resultrect.setAttribute("width", 15); 69 resultrect.setAttribute("height", 15); 70 resultrect.setAttribute("y", pos.y-15); 71 72 if(referenceEqual(m, ref, eps)) 73 { 74 result.textContent = "Passed subtest #" + subtestCounter; 75 } 76 else 77 { 78 passed = false; 79 result.textContent = "Failed subtest #" + subtestCounter + ". Expected " + ref + " but got " + toString(m); 80 } 81 pos.y += 20; 82 subtestCounter++; 83 var results = document.getElementById("subteststatus"); 84 results.appendChild(resultrect) 85 results.appendChild(result); 86 } 87 88 function test() 89 { 90 eps = 0.005; // "close enough" 91 r = document.getElementById("r"); 92 93 t1 = r.transform.baseVal.getItem(0); 94 t2 = r.transform.baseVal.getItem(1); 95 96 // check that matrices are as specified in the markup 97 assertEquals(t1.matrix, [1, 0, 0, 1, 10, 10], eps); 98 assertEquals(t2.matrix, [0, 1, -1, 0, 0, 0], eps); 99 100 // consolidate 101 tfm = r.transform.baseVal.consolidate(); 102 103 // check that the consolidation is ok 104 assertEquals(tfm.matrix, [0, 1, -1, 0, 10, 10], eps); 105 106 // check that t1 and t2 were not affected by the consolidation 107 assertEquals(t1.matrix, [1, 0, 0, 1, 10, 10], eps); 108 assertEquals(t2.matrix, [0, 1, -1, 0, 0, 0], eps); 109 110 // check that modifying t1 has no effect on the consolidated transform 111 t1.setTranslate(10,200); 112 assertEquals(t1.matrix, [1, 0, 0, 1, 10, 200], eps); 113 assertEquals(tfm.matrix, [0, 1, -1, 0, 10, 10], eps); 114 115 // check that modifying t2 has no effect on the consolidated transform 116 t2.setRotate(-90, 0, 0); 117 assertEquals(t2.matrix, [0, -1, 1, 0, 0, 0], eps); 118 assertEquals(tfm.matrix, [0, 1, -1, 0, 10, 10], eps); 119 120 // check that modifying the consolidated transform has no effect on the t1 and t2 transforms 121 tfm.matrix.f = 400; 122 assertEquals(tfm.matrix, [0, 1, -1, 0, 10, 400], eps); 123 assertEquals(t1.matrix, [1, 0, 0, 1, 10, 200], eps); 124 assertEquals(t2.matrix, [0, -1, 1, 0, 0, 0], eps); 125 126 document.getElementById("status").setAttributeNS(null, "fill", passed ? "lime" : "red"); 127 document.getElementById("scriptstatus").textContent = "Scripting enabled"; 128 } 129 130 ]]></script> 131 </defs> 132 133 <g transform="translate(20 -10)"> 134 <g id="subteststatus" transform="translate(0,40)"> 135 <rect id="status" y="5" width="15" height="15" fill="red"/> 136 <text id="scriptstatus" y="20" x="20" >Scripting disabled</text> 137 </g> 138 139 <polyline id="r" fill="none" stroke="green" display="none" transform="translate(10 10) rotate(90)" points="0 0 30 40 80 -20" stroke-width="10"/> 140 </g> 141 </g> 142 <g font-family="SVGFreeSansASCII,sans-serif" font-size="32"> 143 <text id="revision" x="10" y="340" stroke="none" 144 fill="black">$Revision: 1.5 $</text> 145 </g> 146 <rect id="test-frame" x="1" y="1" width="478" height="358" fill="none" stroke="#000"/> 147 <!-- comment out this watermark once the test is approved --><!-- 148 <g id="draft-watermark"> 149 <rect x="1" y="1" width="478" height="20" fill="red" stroke="black" stroke-width="1"/> 150 <text font-family="SVGFreeSansASCII,sans-serif" font-weight="bold" font-size="20" x="240" 151 text-anchor="middle" y="18" stroke-width="0.5" stroke="black" fill="white">DRAFT</text> 152 </g>--> 153 </svg> 154 </body> 155 </html>