PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : SVG, Konqueror und Hintergrund



BlueJay
19-11-2006, 18:09
Hallo Leute,

wie bekommt man den Hintergrund eines SVG-Bildes transparent?

Die Grafiken werden mit php erzeugt und als <object> angezeigt. Firefox funktioniert, wie erwartet, der Hintergrund der Grafik ist transparent. Konqueror 3.5.5 gönnt sich bei dem SVG leider einen weißen Hintergrund, was nicht so dolle aussieht.

Den bekommt man mit


<object data="fleurmaker.php?farbe=0&amp;muster=2&amp;hilite=0"
type="image/svg+xml" width="110" height="110"
style="background-color:#345"> SVG </object>

nicht weg.

Und warum zeigt Konqueror bei Verwendung symbol/use statt g gar nichts mehr an?

url:
http://gamecraft.soltau.gotdns.com/php/fleur/
(nur bei schnellen Leitungen anklicken)

Code eines der Bilder: http://gamecraft.soltau.gotdns.com/php/fleur/fleurmaker.php?farbe=0&muster=0&hilite=0

so long,
BlueJay

undefined
20-11-2006, 10:48
Standardmäßig verwendet KDE den Hintergrund vom SVG Viewer.
Du kannst aber den Hintergrund im SVG an das Dokument anpassen.


<!--
Setze Beispiel Hintegrund
Von Links Oben 12cm Breit 3,5 cm Hoch
-->
<rect x="0" y="0" width="1200" height="350" fill="#000000" />


Oder du verwendest currentColor


<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg width="7cm"
height="2cm"
viewBox="0 0 700 200"
xmlns="http://www.w3.org/2000/svg">
<desc>Gradiant</desc>
<g>
<defs>
<linearGradient id="MeinGradiant" gradientUnits="objectBoundingBox">
<stop offset="0%" stop-color="#F60" />
<stop offset="100%" stop-color="#FF6" />
</linearGradient>
</defs>
<rect x="1" y="1" width="698" height="198" fill="currentColor" stroke="white" stroke-width="2" />
<g fill="url(#MeinGradiant)" >
<rect x="100" y="50" width="200" height="100"/>
<rect x="400" y="50" width="200" height="100"/>
</g>
</g>
</svg>

http://www.schumacher-netz.de/TR/2001/SVG/types.html#DataTypeColor http://www.schumacher-netz.de/TR/2001/SVG/types.html#DataTypeColor
http://www.schumacher-netz.de/TR/2001/SVG/masking.html#SimpleAlphaBlending

undefined
20-11-2006, 11:56
Ich habe mir mal deinen SVG Code angesehen. Bei use verwendest du transform ohne Vorgabe der Grundmaße. Deshalb verweigert der KSVG Viewer die Anzeige. Ich würde auch auf Transform verzichten weil es ein Speicher fresser ist. ;) Siehe auch die svg Attributes viewBox


< ? xml version="1.0" standalone="no" ? >
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg width="105" height="105"
viewBox="0 0 105 105"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- hier Gesamtbreite des Bildes angeben -->
<defs>

<linearGradient id="v_0" x1="0%" x2="100%" y1="0%" y2="100%">
<stop offset="10%" stop-color="#ffffcc" stop-opacity="1" />
<stop offset="90%" stop-color="#999966" stop-opacity="1" />
</linearGradient>

<linearGradient id="v_1" x1="0%" x2="0%" y1="0%" y2="100%">
<stop offset="10%" stop-color="#330099" stop-opacity="1" />
<stop offset="90%" stop-color="#ffee00" stop-opacity="1" />
</linearGradient>

<symbol id="platte" stroke-width="2" stroke="#000000" x="0" y="0" width="105" height="105">
<rect x="2.5" y="2.5" width="100" height="100" rx="3" ry="3" stroke="#333333" fill="#333300"/>
<rect x="0" y="0" width="100" height="100" rx="3" ry="3" stroke="#000000" fill="url(#v_0)"/>
<rect x="10" y="10" width="80" height="80" stroke="#223311" fill="none"/>
<rect x="15" y="15" width="70" height="70" fill="none"/>
<polygon points="20,20 20,40 40,20" fill="#000000" />
<polygon points="80,20 80,40 60,20" fill="#000000" />
<polygon points="20,80 20,60 40,80" fill="#000000" />
<polygon points="80,80 80,60 60,80" fill="#000000" />
<polygon points="50,20 80,50 50,80 20,50, 50,20" fill="url(#v_1)"/>
</symbol>

</defs>

<use xlink:href="#platte" />

</svg>


PS : Schöne Grafik :o

BlueJay
20-11-2006, 16:28
Ich habe mir mal deinen SVG Code angesehen. Bei use verwendest du transform ohne Vorgabe der Grundmaße.


Korrigierte Version klappt :)



Oder du verwendest currentColor


Konqueror 3.5.5 lässt sich davon nicht beeindrucken.

ABER:
Die Dinger sollen auf einem bisher unbekannten oder auch wechselndem Hintergrund erscheinen. Da ist mit Hintergrund türken leider nix, der wird zwingend von einem anderen Programm vorgegeben.
Genauso ist es mit der Größe, die soll sich letztendlich von aussen scriptmäßig steuern lassen.

Schade, dass bei den CSS-Links nichts wie "transparent" oder "none" auftauchte.


PS : Schöne Grafik :o

Finden tausende andere pro Monat auch :)
Originale:
Javascript Fleur (http://gamecraft.soltau.gotdns.com/fleur/index.htm)

soll jetzt vektorisiert werden, Grafiken sind dank php soweit auch fertig. :rolleyes:
Aber die Anzeige im Mozilla lässt sich Zeit, wie das mit KDE4 wird, bleibt noch abzuwarten.

so long,
BlueJay