Bezier-Kurve immer die gleiche Länge
Ich arbeite an einem Spiel in HTML5 Canvas.
Ich möchte eine S-förmige kubische Bezier-Kurve zwischen zwei Punkten zeichnen, aber ich suche nach einer Möglichkeit, die Koordinaten der Kontrollpunkte so zu berechnen, dass die Kurve selbst immer die gleiche Länge hat, egal wie nahe diese Punkte sind sind, bis es den Punkt erreicht, wo die Kurve eine gerade Linie wird.
3 Antworten
Dies ist numerisch lösbar. Ich nehme an, Sie haben einen kubischen Bezier mit 4 Kontrollpunkten. Bei jedem Schritt haben Sie den ersten (P0) und letzten (P3) Punkt, und Sie wollen P1 und P2 so berechnen, dass die Gesamtlänge konstant ist.
Das Hinzufügen dieser Bedingung entfernt einen Freiheitsgrad, so dass wir 1 übrig haben (angefangen mit 4, bestimmt die Endpunkte (-2) und die konstante Länge ist eine weitere -1). Also müssen Sie sich darüber entscheiden.
Die Bezier-Kurve ist ein Polynom, das zwischen 0 und 1 definiert ist. Sie müssen die Quadratwurzel der Summe der Elemente (2d?) integrieren. für einen kubischen Bezier bedeutet dies ein Quadrat eines 6-Grad-Polynoms, das Wolfram nicht zu lösen weiß. Wenn Sie jedoch alle anderen Kontrollpunkte kennen (oder bis zu einer Abhängigkeit von einer anderen Bedingung bekannt sind), können Sie eine Tabelle mit vorberechneten Werten für diese Einschränkung speichern.
Ist es wirklich notwendig, dass die Kurve eine Bezier-Kurve ist? Das Anpassen von zwei Kreisbögen, deren Gesamtlänge konstant ist, ist viel einfacher. Und Sie erhalten immer eine S-Form.
Anpassung von zwei Kreisbögen:
Sei D der euklidische Abstand zwischen den Endpunkten. Sei C die konstante Länge, die wir wollen. Ich habe den folgenden Ausdruck für b (im Bild gezeichnet):
%Vor%Ich habe nicht überprüft, ob es korrekt ist. Wenn jemand etwas anderes bekommt, hinterlasse einen Kommentar.
BEARBEITEN: Sie sollten auch die negative Lösung berücksichtigen, die ich beim Lösen der Gleichung erhalte und prüfen, welche korrekt ist.
%Vor% Hier ist ein funktionierendes Beispiel in SVG, das close korrigiert:
Ссылка
Ich habe experimentell festgestellt, dass, wenn die Endpunkte übereinander liegen, die Griffe sein sollten: gewünschteLänge × cos (30 °) weg von den Griffen; und (natürlich) wenn die Endpunkte in ihrer größten Entfernung sind, sollten die Griffe übereinander liegen. Das Zeichnen aller idealen Punkte sieht Art wie eine Ellipse aus:
Die blaue Linie ist die tatsächliche ideale Gleichung, während die rote Linie darüber eine Ellipse ist, die dem Ideal entspricht. Mit der Gleichung für die Ellipse (wie in meinem Beispiel oben gezeigt) kann die Linie in der Mitte etwa 9% zu lang werden.
Hier ist der relevante JavaScript-Code:
%Vor%