Linie zu Kurve verformen - curveTo

[jürgen b.]

Hallo,

mein Ziel ist es, den Benutzer eine Kurve mit ca. 10 "Schiebern" selbst einstellen zu lassen. Ausgehend von einer horizontalen Linie soll er hier eine Leistungskurve (mit minima und maxima) einstellen. Habe ja schon in Sachen Bezier und curveTo einiges recherchiert, aber die Kurve soll immer rund bleiben, keine Ecken haben.

Hier gibt es bei schieber2 immer einen Knick:

this.onEnterFrame = function() {

moveTo(200, schieber0._y);
curveTo(300, schieber1._y, 400, schieber2._y);
curveTo( 400, schieber2._y, 500, schieber3._y );
}


Wie kann ich die curveTo miteinander verbinden, dass die resultierende Kurve nur Rundungen hat?

Wär toll, wenn mir jemand helfen könnte
Grüße
Jürgen

[Janoscharlipp]

angenommen du malst eine Kurve von p1 nach p2 nach p3 mit den Orientierungspunkten m1 und m2, dann ist die Kurve nur dann rund, wenn m1, p2, und m2 auf einer Geraden liegen.

[jürgen b.]

Genau, das ist ja mein Prob. Ich möchte so eine Kurve (siehe Bild) zum Selbsteinstellen bauen. Da gibt es keine Ecken.

[Janoscharlipp]

Naja, die Herangehensweise ist ja eigentlich klar. Der User legt Punkte auf senkrechten Geraden fest, und du musst dazu die passenden Orientierungspunkte finden.

An jeder Ecke bildest du die Senkrechte zur Winkelhalbierenden zum linken und rechten Schnenkel der Ecke. Wenn der vorhergehende Orientierungspunkt und der Nachfolgende darauf liegen, sieht deine Kurve brauchbar aus.
Wenn deine Kurve eine konstante Krümmung hat ist es leicht.
Wenn du 2 Ecken hast (also 4 Punkte) so muss der mittlere Orientierungspunkt auf dem Schnittpunkt der beiden Winkelhalbierenden liegen.
Schwieriger wird es, wenn 4 Punkte S-förmig angeordnet sind, dann musst du einen Punkt auf der mittleren Geraden einführen, durch den die Kurve geht.
Ich habe dazu mal ne Skizze gemacht, die blauen Punkte sin die Punkte, welche der User eingestellt hat, die Roten sind die Gesuchten Orientierungspunkte.
Die grünen Geraden sind die Senkrechten zu den Winkelhalbierenden.
Der gelbe Punkt ist der wegen S-förmig angeordneten User-Punkten eingeführte Mittelpunkt.

Wenns wirklich wichtig ist, kannste mir mal ne PM schicken …

[Janoscharlipp]

ok, im Anhang das Bild wie immer vergessen *Kopfaufdemtischzertrümmer*

[hgseib]

vorschlag, bevor ihr hier das halbe freehand nachprogrammiert (ist aber auch nicht einfach):

jürgen b. muss sich ein bisschen (intensiev) in mathe einarbeiten zum thema bézier-kurven!
dann läuft das ganze nicht mit schiebern, sondern du musst punkte positionieren. aus deren koordinaten kann man dann die bézier-kurve berechnen. und ich würde vorschlagen nicht mit curveTo, sondern schöne kurze lineTo's.

so als starthilfe:
http://www.seibsprogrammladen.de/fra...on/Mathe/flash

mit der binomischen formel (a+b)^3 erhält man die beiwerte für 4 punkte. mit (a+b)^4 die beiwerte für eine bézier-kurver über 5 punkte usw.
also für 10 'schieber' musst du nur (a+b)^9 umsetzen. ist weniger schwierig als es sich anhört.

alles klar?

[jürgen b.]

Danke euch beiden. Ich werde da sicher noch tiefer einsteigen, ich muss da mathemäßig tief verschüttetes wieder ausgraben, aber wird schon klappen.

@hgseib werde deinen Ansatz aufnehmen

Ich musste jetzt auf die schnelle eine Demo bauen, in der ich auf Kurven verzichtet habe (also nur ein paar lineTo). Kann mir nochmal jemand helfen?

Ich verstehe nicht warum ab dem 6. "Schieber" das Schieber-MC (ab h6) beim Bewegen immer auf eine fixe x-Position (x=300) weiter links rutscht. Bitte mal kurz ausprobieren(=schieben). Diese fla. ist aus einer Macromedia-Demo entstanden, bei der die Bühne kleiner war. Irgendwie landen die attachten movies immer an der ehemaligen Bühnenkante-wie kann das sein?

Danke

Jürgen

[hgseib]

schon mal was von for-schleifen gehört?

[rendner[i]]

Hier die Datei die hgseib anhängen wollte.

[jürgen b.]

@hgseib hart, aber herzlich
Klar ist das so schlanker (und funktioniert auch besser).
Danke soweit auch an redner