Eine interaktive Darstellung der Mandelbrot-Menge, die räumlich wirkt. Alles steckt in einer einzigen HTML-Datei: kein Installationsvorgang, keine Abhängigkeiten, keine Netzverbindung nötig.
Alle Abbildungen zeigen die Anwendung so, wie sie im Browser steht: links die Darstellung, rechts das Bedienfeld mit sämtlichen Parametern des jeweiligen Modus.
mandelbrot-3d.html im Browser öffnen. Benötigt wird WebGL 2 mit
aktiver Hardwarebeschleunigung.
Das Höhenfeld wird als Prägung in der Bildebene beleuchtet, mit Schlagschatten und Umgebungsverdeckung. Wirkt wie eine gravierte Platte. Das Titelbild oben zeigt diesen Modus.
Dasselbe Höhenfeld als Gelände mit freier Kamera, echter Perspektive, Seitenwänden und Selbstverschattung.
Das räumliche Analogon als eigenständiger Körper, abgetastet über eine Abstandsschätzung.
Übliche Fraktaldarstellungen im Browser enden bei etwa Faktor 10⁵, weil die Grafikkarte einfach genau rechnet. Hier wachsen Stellenzahl und Iterationsgrenze mit der Vergrößerung mit:
- Die Bildmitte wird als Festkommazahl beliebiger Länge geführt,
auf Basis von
BigInt. - Ein einzelner Referenzpunkt wird in dieser Genauigkeit iteriert, alle Bildpunkte rechnen nur noch ihre Abweichung davon (Störungsrechnung mit Rebasing).
- Jeder Bildpunkt führt dabei einen eigenen Exponenten mit, da die Abweichung anfangs winzig ist und im Verlauf auf Größe eins wächst.
Geprüft bis Vergrößerung 2·10¹⁵, rechnerisch ohne Zusammenbruch bis 4·10²⁸. Tiefe Ansichten lassen sich über „Link kopieren" verlustfrei weitergeben.
| Eingabe | Wirkung |
|---|---|
| Ziehen | Relief: verschieben · 3D: Kamera drehen |
| Umschalt + Ziehen | in 3D den Fraktalausschnitt verschieben |
| Mausrad | zoomen, beim Mandelbulb die Kameradistanz |
| Strg + Mausrad | im Terrain die Kameradistanz |
| Doppelklick | an dieser Stelle hineinzoomen |
| Pfeiltasten | schrittweise verschieben |
H F R S |
Bedienfeld · Vollbild · Zurücksetzen · PNG speichern |
| Leertaste | Auto-Rotation ein und aus |
Rund 45 Parameter in neun Gruppen, dazu neun Paletten, sieben Stil-Voreinstellungen und neun voreingestellte Orte im Fraktal.
Nach jeder Änderung verfeinert sich das Bild schrittweise und kommt danach ohne weitere Rechenlast zur Ruhe. Während der Bedienung sinkt die Auflösung automatisch und steigt danach wieder.
- PNG-Export bis 12288 Pixel Breite. Das Bild entsteht kachelweise und ist damit nicht an die Texturgrenze der Grafikkarte gebunden.
- Diagnoseabschnitt mit Bericht über Grafikkarte, Erweiterungen und gemessener Bildzeit je Modus, kopierbar in die Zwischenablage.
- Robust gegen Kontextverlust: Gibt der Browser den Zugriff auf die Grafikkarte frei, baut sich die Darstellung selbständig wieder auf.
- Rückfallpfad auf 8 Bit je Kanal, falls die Erweiterung für Gleitkomma-Ziele fehlt.
- Ferne Grate im Terrain-Modus flimmern noch leicht. Der Regler „Detailtiefe Ferne" steuert den Kompromiss zwischen Ruhe und Schärfe.
- Im Relief-Modus kann ein sehr langer Schlagschatten beim Export an einer Kachelgrenze enden.
- Geprüft ist bisher nur Chromium unter Windows.
Die Datei ist in nummerierte Abschnitte gegliedert. Zwei Renderdurchgänge: Ein Shader berechnet das Fraktal in eine Höhentextur, ein zweiter leitet daraus Normalen, Schatten und Verdeckung ab. Die drei Darstellungsmodi entstehen aus einem gemeinsamen Shader-Quelltext über Präprozessor-Schalter.
Neue Parameter werden ausschließlich als Eintrag in der Datenstruktur
SECTIONS ergänzt; Zustandshaltung, Serialisierung in den Link und
Sichtbarkeitsregeln hängen daran.
MIT, siehe LICENSE. Praktisch bedeutet das: Der Code darf genutzt, verändert und in eigene Arbeiten übernommen werden, auch in kommerzielle, solange der Urhebervermerk erhalten bleibt. Eine Gewähr wird nicht übernommen.
Die GLSL-Streufunktion hash12 stammt aus „Hash without Sine" von Dave
Hoskins und steht ebenfalls unter MIT. Alles Übrige ist für dieses
Projekt entstanden.