nicht angemeldet
SVG inline in XHTML
Hallo,
ich versuche mich gerade daran, SVG direkt in XHTML zu schreiben.
Dies funktioniert auch einwandfrei im Firefox 2.0 und IE 6, wenn ich dem Firefox die Dateiendung .xhtml und dem IE .html gebe.
Jetzt versuche ich über JavaScript eine Linie einzufügen.
Für den IE siehts dann so aus:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<head>
<object id="AdobeSVG" classid="clsid:78156a80-c6a1-4bbf-8e6a-3cd390eeb4e2"></object>
<?import namespace="svg" implementation="#AdobeSVG" ?>
<title>SVG-Datei inline in XHTML</title>
<script type="text/javascript">
function insertLine(id, x1, y1, x2, y2, color)
{
try
{
var line = document.createElement('line');
line.setAttribute('id', id);
line.setAttribute('x1', x1);
line.setAttribute('y1', y1);
line.setAttribute('x2', x2);
line.setAttribute('y2', y2);
line.setAttribute('stroke', color);
document.getElementById('mySVG').appendChild(line);
}
catch (error) {alert(error.message);}
}
</script>
</head>
<body>
<center>
<h1>SVG inline in XHTML</h1>
<svg:svg id="mySVG" viewBox="0 0 500 700" version="1.0">
<svg:line id="id" x1="0" y1="0" x2="50" y2="70" stroke="black"></svg:line>
</svg:svg>
</center>
<a href="#" onclick="insertLine('svgLine', 0, 0, 500, 700, 'black');">Linie einfuegen</a>
</body>
</html>
Schau ich mir jetzt mit Hilfe der IE Developer Toolbar den DOM an, seh ich das die neue Linie dort eingefügt wurde. Sie wird mir aber nicht im Browser gezeichnet.
Weiss jemand Rat?
Im voraus Danke!
Und Gruss
Raphael
-
Hallo Raphael,
Schau ich mir jetzt mit Hilfe der IE Developer Toolbar den DOM an, seh ich das die neue Linie dort eingefügt wurde. Sie wird mir aber nicht im Browser gezeichnet.
Das Problem liegt AFAIK daran, dass der ASV diese Inline-Grafiken statisch rendert und letztlich nur noch eine Rastergrafik übrig bleibt, welche nicht mehr durch das Script angesprochen werden kann. Es sind auch nicht mehr die Bedienfunktionen über Strg- bzw. Alt-Taste verfügbar und ein Rechtsklick auf der Grafik zeigt auch kein Kontextmenü an.
Ich habe solche Versuche sehr früh aufgegeben. Probiere es alternativ mal mit dem Renesis-Plugin.
Grüße,
Thomas