14.10.2021
Bitte betten Sie die obere path-Anweisung in einen lauffähigen SVG-Code ein, und experimentieren Sie mit ihr: ändern Sie die Koordinaten und beobachten Sie, wie sich der Spline dadurch verändert. Erläutern Sie am Beispiel was passiert, wenn Sie die erste, die zweite, die dritte Koordinate ändern. Erläutern Sie am Beispiel, warum Großbuchstaben zu anderen Ergebnissen führen als Kleinbuchstaben.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="85 75 86 148"
height="300px" style="display: block; margin: 0 auto;">
<path d="M120,80 C90,90, 150,100, 90,220" fill="none" stroke="black"/>
</svg>Die erste Koordinate (120, 80) beschreibt den Anfangspunkt des Splines (p0). Wenn man diese Koordinate ändert, verschiebt sich also der Anfangspunkt. Da die anderen Koordinaten sich allerdings nicht ändern, vergrößert sich beim Verschieben nach Rechts der Abstand zum Kontrollpunkt (m0) und damit hat dieser einen größeren Effekt. Ergo, der Spline besitzt eine stärkere Linkskurve.
Die zweite Koordinate (90, 90) beschreibt den Kontrollpunkt bzw. die Tangente des Anfangspunkts (m0). Würde man diese Koordinate näher an den Anfangspunkt (p0) verschieben, hätte der Kontrollpunkt weniger Einfluss auf den Verlauf des Splines und demnach wird dieser flacher bzw. glätter.
Die dritte Koordinate (150, 100) beschreibt den Kontrollpunkt bzw. die Tangente des Endpunktes (m1). Da dieser Kontrollpunkt recht weit vom Endpunkt (m1) entfernt ist, hat er einen großen Einfluss und man sieht auch im Spline, dass ein recht großes Stück in richtung dieser Koordinate verläuft. Würde man diese Koordinate nach links (links vom Endpunkt) verschieben, würde ein Spline entstehen, der nur eine Linkskurve beinhaltet.
Und die vierte Koordinate (90, 220) beschreibt den Endpunkt des Splines (p1). Wenn man diesen verschiebt, verschiebt sich das Ende des Splines. Würde man diesen nach unten verschieben, wär der Spline bspw. länger.
Der Unterschied zwischen kleinen und großen führenden Buchstaben ist, dass bei einem Großbuchstaben die folgende(n) Koordinate(n) als absolut bzw. relativ zum Koordinatensystem und diese bei einem Kleinbuchstaben relativ zur aktuellen Zeichenposition bzw. zuletzt angegeben Koordinate verstanden werden.
Daher enteht bei der Nutzung von Kleinbuchstaben ein völlig anderer Spline als mit Großbuchstaben:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 75 300 230" height="300px" style="display: block; margin: 0 auto;">
<path d="m120,80 c90,90, 150,100, 90,220" fill="none" stroke="black"/>
</svg>