Übung 13

Verketten Sie zwei Splines “glatt”. Betrachten Sie die Bezier-Kurve K1 in SVG:
K1: <path d="M110,70 C90,90, 130,100, 90,200" fill="none" stroke="black"/>

Die Bezier-Kurve K2 soll glatt (parametrisch stetig) an K1 anschließen.
K2: <path d="M...,.. C...,... 350,400, 360,130" fill="none" stroke="black"/>

Finden Sie heraus, wie Sie rechnerisch (nicht allein durch Ausprobieren) die Werte ermitteln können, die Sie anstelle der Punkte einsetzen müssen? Notieren Sie Ihre Berechnungen.

Hinweis: Benennungen der (Kontroll)Punkte wie in Übung 11.

Endpunkt des ersten Paths (p1): 90, 200
Dieser Punkt muss auch der Anfangspunkt des zweiten Paths sein (p0 von Path 2 = p1 von Path 1).

Kontrollpunkt bzw. Tangente des Endpunktes von Path 1 (m1): 130, 100 (asolut) Umrechnung in relative Koordinaten zum Endpunkt des ersten Paths (p1): m1 – p1 => 130 - 90 = 40; 100 – 200 = -100 => 40, -100

Umkehrung des Kontrollpunkts: p1 - (40, -100) => 90 – 40 = 50, 200 – (-100) = 300 => 50,300
Dies ist der neue Kontrollpunkt des Anfangspunktes des zweiten Paths.

<svg viewBox="80 60 290 250">
  <path d="M110,70 C90,90, 130,100, 90,200" fill="none" stroke="black"/>
  <path d="M90,200 C50,300 350,400, 360,130" fill="none" stroke="black"/>
</svg>

Geschrieben von@Dennis Adamczyk
Matrikelnummer: 30545