SVG – Learning by Coding
1: <?xml version="1.0" encoding="ISO-8859-1" standalone="no"?>
2: <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
3: "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
4: <!ATTLIST svg xmlns:xlink CDATA #FIXED "http://www.w3.org/1999/xlink">
5: ]>
6:
7: <!-- SVG - Learning by Coding - http://www.datenverdrahten.de/svglbc/ -->
8: <!-- Author: Dr. Thomas Meinike 09/05 - thomas@handmadecode.de -->
9:
10: <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
11:
12: <title>SVG - Learning by Coding</title>
13: <desc>SVG-Spezifikation in Beispielen</desc>
14:
15: <defs>
16:
17: <script type="text/javascript">
18: <![CDATA[
19:
20: var clk=true;
21:
22: function MozDOMTest5()
23: {
24: if(clk)
25: {
26: if((navigator.mimeTypes &&
27: navigator.mimeTypes["image/svg+xml"] &&
28: !navigator.mimeTypes["image/svg+xml"].enabledPlugin) ||
29: document.implementation.hasFeature("org.w3c.dom.svg","1.0"))
30: {
31: var req,xmldoc,xsldoc,xsltproc,output;
32:
33: if(window.XMLHttpRequest)
34: {
35: // synchroner XMLHttpRequest-Zugriff, bei umfangreicheren Dokumenten
36: // ggf. die asynchrone Variante verwenden, siehe Mozilla-DOM-Test_1.svg
37:
38: // XML laden
39: req=new XMLHttpRequest();
40: req.open("GET","moztest.xml",false);
41: req.overrideMimeType("text/xml");
42: req.send(null);
43: xmldoc=req.responseXML;
44:
45: // XSL laden
46: req=new XMLHttpRequest();
47: req.open("GET","moztest.xsl",false);
48: req.overrideMimeType("text/xml");
49: req.send(null);
50: xsldoc=req.responseXML;
51:
52: // neue XSLT-Prozessor-Instanz erzeugen und Stylesheet zuweisen
53: xsltproc=new XSLTProcessor();
54: xsltproc.importStylesheet(xsldoc);
55:
56: // Transformation ausfuehren (zwei Varianten):
57:
58: // transformToFragment() --> Ergebnis: Dokumentfragment
59: output=xsltproc.transformToFragment(xmldoc,document);
60:
61: // transformToDocument() --> Ergebnis: Dokumentobjekt
62: // output=xsltproc.transformToDocument(xmldoc);
63: // output=document.importNode(output.documentElement,true);
64:
65: // Ergebnis der Transformation in den SVG-DOM-Baum einhaengen
66: document.documentElement.appendChild(output);
67: }
68: else alert("Kein Ergebnis erhalten!");
69: }
70: else alert("Keine SVG-Implementierung\nauf Mozilla-Basis gefunden!");
71: }
72: else alert("Der Test wurde bereits ausgeführt!");
73: }
74:
75: ]]>
76: </script>
77:
78: </defs>
79:
80: <text x="20" y="30" style="fill: #000; font-size: 24px">
81: Mozilla-DOM: SVG-Inhalte mittels XSLT erzeugen</text>
82:
83: <a xlink:href="" cursor="pointer" onclick="return false"><text x="20" y="60" style="fill: #F00; font-size: 14px"
84: onclick="MozDOMTest5();clk=false">Test ausführen!</text></a>
85:
86: </svg>
[zum Anfang]