Ich sammle einige Informationen für ein Projekt, das innerhalb weniger Wochen beginnen muss. Dieses Projekt enthält ein browserbasiertes Zeichenwerkzeug, mit dem Benutzer vordefinierte Formen hinzufügen oder Formen selbst bilden können. Formen müssen mit einem Illustrator-ähnlichen Transformationswerkzeug (Griffen) auswählbar, frei skalierbar und drehbar sein. Vordefinierte Formen, an die wir denken, sind: Rechtecke, Ellipsen, Halbellipsen und (gleichschenklige) Dreiecke.

So weit so gut, um dies zu erreichen, dachte ich an RaphaelJS oder FabricJS, aber ... Jede Form (Polygon / Pfad) muss mit einem bestimmten Eckradius gezeichnet werden. Und der Eckradius muss beim Skalieren eingehalten werden, damit keine Verzerrungen auftreten. Der Benutzer kann die Rundung durch Eingabe festlegen.

Es gibt ein paar Hindernisse / Fragen:

Gibt es eine einheitliche mathematische Formel, um einen Eckradius auf die von mir erwähnten Formen anzuwenden? Oder muss jede Form als Miniprojekt behandelt werden? Ich möchte es als Pfad oder Poly zurückgeben, damit es mit SVG oder Canvas gezeichnet werden kann.Jede Skalierung oder Drehung durch Ziehen der Transformationsgriffe führt zu (massiven) Berechnungen, um eine aktualisierte Form zu erhalten. Rechtecke sind am einfachsten zu erzielen, und mit Ausnahme von Ellipsen sind alle anderen Formen viel schwerer zu berechnen. Gibt es eine Möglichkeit, den Prozess zu beschleunigen?

Ich habe eine Site gefunden, auf der Benutzer Flussdiagramme zeichnen und einen Eckenradius auf fast alle angebotenen Formen anwenden können. Es funktioniert so reibungslos, ich kann nicht genau sagen, wie sie es gemacht haben. Verknüpfung:https://www.lucidchart.com/ (Versuchsknopf)

Im Moment bin ich ein bisschen ahnungslos, ich denke, ich bin mittelmäßig in Mathematik. Vielleicht kann mich jemand in die richtige Richtung treiben und Erfahrungen austauschen?

Danke im Voraus.

Übrigens. Leistung ist der Schlüssel in diesem Projekt. Die Ausgabe der Zeichnung muss im SVG-Format sein.