Quadratische Funktion → Bézierkurve

Gegeben ist eine quadratische Funktion

$$f(x) = ax^2 + bx + c$$

im Intervall $[d, e]$ und wir möchten ihren Graphen, eine Parabel, zeichnen. In vielen Programmen wie auch im Vektorgrafikformat SVG geht das mit einer quadratischen Bézierkurve, welche mittels dreier Bézierpunkte $P_0$, $P_1$ und $P_2$ definiert wird. Aber wie findet man die Koordinaten der Punkte? Indem man in diese Tabelle schaut:

	$x$	$y$
$P_0$	$d$	$ad^2 + bd + c$
$P_1$	$\frac{d + e}{2}$	$ade + b\cdot\frac{d + e}{2} + c$
$P_2$	$e$	$ae^2 + be + c$

Im Folgenden veranschauliche ich die Frage anhand von Grafiken und zeige danach, wie ich die Koordinaten der Punkte hergeleitet habe. Auf einer anderen Seite behandele ich den umgekehrten Weg von Bézierpunkten zur quadratischen Funktion. Mehr Informationen zu Bézierkurven finden sich in der englischen Wikipedia.

Veranschaulichung

Wenn man zu jeder Zahl $x$ zwischen $d$ und $e$ einen Wert $y = ax^2 + bx + c$ ausrechnet, dann ergeben alle Koordinatenpaare $(x,y)$ zusammen einen Parabelbogen. Man nennt dies den Graphen der quadratischen Funktion $f(x) = ax^2 + bx + c$ im Intervall $[d, e]$.

Graph einer quadratischen Funktion $f(x) = ax^2 + bx + c$ im Intervall $[d, e]$.

Eine quadratische Bézierkurve ist in Abhängigkeit eines Parameters $t$ im Intervall $[0,1]$ durch die Funktion $B(t) = (1-t)^2P_0 + 2t(1-t)P_1 + t^2P_2$ definiert. Auch diese Formel beschreibt einen Parabelbogen. $P_0$, $P_1$ und $P_2$ sind die Bézier- beziehungsweise Kontrollpunkte der Kurve in kartesischen Koordinaten.¹ Veranschaulichen kann man sich die Erzeugung der Bézierkurve als Prozess, bei dem der Parameter $t$ den Zeitpunkt angibt:

Der Punkt $Q_0$ läuft von $P_0$ nach $P_1$, zeitgleich der Punkt $Q_1$ von $P_1$ nach $P_2$ und zeitgleich der Punkt $B$ von $Q_0$ nach $Q_1$. Der Stand zum Zeitpunkt ⅗ ist abgebildet: $Q_0$ liegt bei ⅗ der Strecke $\overline{P_0P_1}$ und $Q_1$ bei ⅗ der Strecke $\overline{P_1P_2}$ und $B$ bei ⅗ der Strecke $\overline{Q_0Q_1}$. Im Lauf der Zeit beschreibt $B$ einen Parabelbogen, die quadratische Bézierkurve.

Herleitung

Da die Bézierpunkte $P_0$ und $P_2$ auf der Kurve liegen und diese begrenzen, entsprechen ihre x-Koordinaten den Intervallgrenzen, $x_0 = d$ und $x_2 = e$, und ihre y-Koordinaten entsprechen den Funktionswerten der quadratischen Funktion an jenen Stellen, $y_0 = f(d)$ und $y_2 = f(e)$.

Als Herausforderung bleiben somit die Koordinaten von $P_1$. Dieser Punkt ist zweifellos Schnittpunkt der zwei Geraden mit den Abschnitten $\overline{P_0P_1}$ und $\overline{P_1P_2}$. Für sie werden wir Geradengleichungen der Form $y = m(x - x_P) + y_P$ erstellen, wobei $m$ die Steigung und $x_P, y_P$ die Koordinaten eines bekannten Punktes bezeichnen.

Je einen Punkt haben wir schon, $P_0$ und $P_2$, und benötigen noch die jeweilige Steigung. Dafür nutzen wir, dass die fraglichen Geraden Tangenten der Kurve sind: Ihre Steigungen sind in den Punkten $P_0$ beziehungsweise $P_2$ identisch mit den Steigungen des Graphen der quadratischen Funktion.

Die Steigungen einer Funktion verrät ihre erste Ableitung. $f'(x) = 2ax + b$ ist die Ableitung der quadratischen Funktion $f(x) = ax^2 + bx + c$. Mit der Ableitung lauten die Gleichungen für die beiden Geraden:

$$y = f'(x_0)\cdot(x - x_0) + y_0$$

$$y = f'(x_2)\cdot(x - x_2) + y_2$$

Wir suchen den Schnittpunkt dieser Geraden. Im Schnittpunkt $P_1$ sind die x- und y-Werte beider Geraden identisch. Wir können daher $y$ und folglich die rechten Seiten der Geradengleichungen gleichsetzen. Aus der Variable $x$ wird dabei $x_1$, die Schnittstelle beider Geraden.

$$f'(x_0)\cdot(x_1 - x_0) + y_0 = f'(x_2)\cdot(x_1 - x_2) + y_2$$

Wir stellen diese neue Gleichung nach $x_1$ um:

$$x_1 = \frac{f'(x_0)\cdot x_0 - f'(x_2)\cdot x_2 + y_2 - y_0}{f'(x_0) - f'(x_2)}$$

Auf der rechten Seite finden sich keine Unbekannten mehr, sodass wir emsig einsetzen:

$$x_1 = \frac{(2ad + b)\cdot d - (2ae + b)\cdot e + (ae^2 + be + c) - (ad^2 + bd + c)}{(2ad + b) - (2ae + b)}$$

Erfreulicherweise summieren sich viele Teile des Bruches zu null und übrig bleibt:

$$x_1 = \frac{ad^2 - ae^2}{2ad - 2ae}$$

Das Ende des Machbaren ist damit noch nicht erreicht. Wir klammern über und unter dem Bruchstrich $a(d - e)$ aus, wobei wir im Zähler auf die dritte binomische Formel zurückgreifen, und kürzen. Das Ergebnis:

$$x_1 = \frac{d + e}{2}$$

Die zugehörige y-Koordinate erhalten wir, indem wir $x_1$ in eine der beiden Geradengleichungen einsetzen:

$$y_1 = f'(x_0)\cdot(x_1 - x_0) + y_0$$

Wir ersetzen Bekanntes:

$$y_1 = (2ad + b)\left(\frac{d + e}{2} - d\right) + (ad^2 + bd + c)$$

Nach dem Ausmultiplizieren und Zusammenfassen erhalten wir:

$$y_1 = ade + b\cdot\frac{d + e}{2} + c$$

Damit sind alle Koordinaten der Kontrollpunkte für die quadratische Bézierkurve gefunden.

Jene Funktion mit Punkten als Koeffizienten und Funktionswert können wir in zwei „einfache“ Funktionen zerlegen, eine für die x-Koordinate, $x_B(t) = (1-t)^2x_0 + 2t(1-t)x_1 + t^2x_2$, und eine für die y-Koordinate, $y_B(t) = (1-t)^2y_0 + 2t(1-t)y_1 + t^2y_2$.