SVG animation vivus

[Henry]

Hallo Matthias,

Die Pfade haben eine Randlinie (stroke), die mit stroke-dasharray gestrichelt und mit stroke-dashoffset verschoben und damit animiert werden können.

• SVG/Tutorials/Einstieg/SVG mit CSS animieren#Laufende_Linien

Deine Grafik hat keine Festlegungen also nimmt der Pfad als Füllung den Standardwert schwarz und als Randlinie eben keine. Deshalb kann auch kein Rand gezeichnet werden.

puhhh, das scheint wohl eine Kunst für sich zu sein. Muss ich mich wohl doch erst mal einlesen.

<?xml version="1.0" encoding="UTF-8"?>
<svg  version="1.1" viewBox="0 0 2000.0001 1999.9999" xmlns="http://www.w3.org/2000/svg">
 <g transform="translate(610.95 633.82)">
  <path d="m279.9 1360.4c-295.99-33.278-561.51-196.34-726. 
fill="none" stroke="blACK" stroke-width="15"/>
 </g>
</svg>

Du scheinst ja fit darin zu sein. Wie hast du das so schnell umsetzen können? Wenn ich mir den Quelltext von svg-Dateien anschaue und vor allem die Pfade, dann verstehe ich leider (noch) gar nichts, ausser dem rudimentären.

Et voilà:

Zwar noch keine sauberen Linien aber dafür unglaublich schnell umgesetzt.

Danke für die Infos.

Gruss
Henry