Wie werden die Bogenlängen von Bézier-Kurven und elliptischen Bögen berechnet?

Geradlinige Segmente nutzen direkte Distanzformeln, während kubische und quadratische Bézier-Kurven sowie elliptische Bögen über adaptive Simpson-Quadratur mit hoher numerischer Präzision integriert werden.

Unterstützt das Tool relative SVG-Befehle und kompakte Flags?

Ja, sämtliche SVG-Befehle (Groß- und Kleinschreibung wie m, l, c, s, q, t, a, z) sowie zusammenhängende Zahlenfolgen und kompakte Bogen-Flags wie '0 1150 30' werden vollständig unterstützt.

Wie hilft das Tool bei stroke-dashoffset-Animationen?

Die Tabelle listet kumulative Start- und Enddistanzen jedes Segments auf, sodass Keyframes exakt an Segmentgrenzen ausgerichtet werden können – sowohl in Benutzereinheiten als auch mit pathLength='1'.

Was passiert bei S- und T-Kurzbefehlen?

S- und T-Befehle spiegeln den vorherigen Kontrollpunkt automatisch nach SVG-Spezifikation und zeigen die resultierenden Handle-Vektoren im absoluten Koordinatenraum an.

Welche Prüfung führt das Tool bei der viewBox durch?

Es berechnet die analytische Bounding-Box des Pfades, prüft auf Überläufe oder Ränder im Verhältnis zur eingegebenen viewBox und schlägt bei Bedarf eine passgenaue Box vor.

Elysia Tools

Mobile Navigation

Design

SVG-Pfaddaten-Längenläufer

Gehe einen SVG-Pfad Befehl für Befehl durch (M/L/H/V/C/S/Q/T/A/Z) — Bogenlängen pro Segment, kumulative stroke-dashoffset-Distanzen, Bounding-Boxes pro Unterteilpfad, kubische Handle-Vektoren, Arc-Flag-Lösung und Pfad-vs-viewBox-Ausrichtung.

Einzelheiten

Wobei dieses Tool hilft

Füge ein beliebiges d-Attribut eines SVG- ein und der Läufer tokenisiert den kompletten Befehlsstrom — M m L l H h V v C c S s Q q T t A a Z z, implizite Wiederholungen, kompakte Arc-Flags wie „0 1150 30“ — und rekonstruiert jedes Segment in absoluten Koordinaten. Jedes Segment erhält eine präzise Bogenlänge: exakte Formeln für Geraden, adaptive Simpson-Quadratur (relative Toleranz 1e-9) für die Geschwindigkeitsintegrale kubischer/quadratischer Bézier-Kurven und elliptischer Bögen, analytische Extremwerte (Ableitungswurzeln) für enge Bounding-Boxes statt Abtastung. Die Befehlstabelle zeigt Start-/Enddistanz entlang des Pfades, sodass jede stroke-dasharray/stroke-dashoffset-Animation eine exakte Befehlsgrenze anzielen kann — mit fertigen Snippets in Roh-Benutzereinheiten und normalisiert mit pathLength="1". S- und T-Befehle lösen ihre reflektierten Griffe, sodass du das echte Vektorfeld des Renderers siehst; A-Befehle werden über die Endpunkt→Zentrum-Parametrisierung von SVG 2 gelöst, mit Zentrum, θ1, Δθ und Anwendung der Radien-Skalierungsregel, wenn die Sehne 2·rx/2·ry übersteigt. Ein optionaler viewBox erhält ein Ausrichtungs-Audit: Überlauf, Ränder, Zentrierungsversatz und ein vorgeschlagener enger viewBox.

Ausführung

Dieses Tool ausführen

Fülle das Formular aus, starte das Tool und prüfe das Ergebnis an einem Ort.

Beispiele

Beispiele zu diesem Tool

Verwandt

SVG-Pfaddaten-Längenläufer

Wobei dieses Tool hilft

Dieses Tool ausführen

Beispiele zu diesem Tool

Mit verwandten Tools und Themen fortfahren

Erfahren Sie, wann dieses Tool passt, was es unterstützt und wie Nutzer es anwenden.

Wichtige Fakten

Überblick

Wann verwenden

So funktioniert es

Anwendungsfälle

Beispiele

1. Analyse einer kubischen S-Kurve

2. Überprüfung von elliptischen Bögen und viewBox-Passung

FAQ

SVG Beispiele

SVG-Beispiele

D3.js Datenvisualisierung Beispiele

XML-Beispiele

Schriftdatei-Inspektor (TTF / OTF / WOFF / WOFF2)

Akkordfolgen-Detektor

SVG-Minifier und Analyzer

CSS-Farbverlaufs-Mesh-Generator (konisch + radial)