Hallo,

ich schon wieder, und wieder mit SVG...

Ziel: ein schönes Geflecht darstellen

Okay, dachte ich, da nimmt man konzentrische Kreise und setzt die um weniges versetzt nebeneinander, das gibt das entsprechende "Interferenzmuster".

Also erst mal eine einzige "Welle" erzeugt mit:

Code:
 <radialGradient id="welle" r="1%" spreadMethod="repeat"> 
    <stop offset=" 5%" stop-color="#000000" stop-opacity="10%" />
    <stop offset="50%" stop-color="#ddeeff" stop-opacity="100%" />
    <stop offset="95%" stop-color="#665577" stop-opacity="10%"/>
  </radialGradient>
die dann versetzt in 4 Wellenbasen eingebaut:
Code:
  <radialGradient id="strahl0"  cx="45%" cy="45%" xlink:href="#welle" />
  <radialGradient id="strahl1"  cx="55%" cy="45%" xlink:href="#welle" />
  <radialGradient id="strahl2"  cx="55%" cy="55%" xlink:href="#welle" />
  <radialGradient id="strahl3"  cx="45%" cy="55%" xlink:href="#welle" />
und diese überlagert:
Code:
   <circle  fill="url(#strahl0)" cx="50" cy="50" r="45" />  
   <circle  fill="url(#strahl1)" cx="50" cy="50" r="45" />  
   <circle  fill="url(#strahl2)" cx="50" cy="50" r="45" />  
   <circle  fill="url(#strahl3)" cx="50" cy="50" r="45" />
Problem:
Unter Linux (suse) tun zwar Konqueror und Chrome das, was sie sollen, aber Mozilla Firefox will nicht so wie ich will: der macht nur exzentrisch-konzentrische Kreise.

Nachzusehen hier:
http://gamecraft.de/svg_pics/index.htm

Anscheinend streikt er beim Ändern der Opacity im radialGradient.
Oder habe ich da noch etwas übersehen?

Gruß,
Ulrike