🏔️ 3D-Oberflächenplotter

Ein Oberflächendiagramm visualisiert eine Funktion mit zwei Variablen, z = f(x, y), als Höhenfeld: Für jeden Punkt in der flachen x/y-Ebene liefert die Funktion einen Höhenwert z, und durch Verknüpfung dieser Höhen entsteht ein glattes Netz, das im 3D-Raum schwebt. Die Farbe kodiert in der Regel die Höhe, sodass Gipfel und Täler sofort erkennbar sind. Das ist die natürliche Darstellung für Dinge wie Gelände, Temperatur auf einer Platte oder die Form einer mathematischen Sattelfläche.

Das Tool berechnet eine Gittermatrix (bis zu 40×40), indem es Ihre Funktion über den gesamten Bereich auswertet, dreht dann die Punkte mit zwei von Ihnen gesteuerten Winkeln, projiziert die rotierenden Punkte per einfacher isometrischer Projektion auf 2D und sortiert die Flächen von hinten nach vorne, sodass nahe Flächen entfernte überdecken — der klassische painter's algorithm. Alles wird mit reinem HTML canvas gezeichnet: Es gibt weder WebGL noch three.js, wodurch das Tool klein und frei von Abhängigkeiten bleibt.

Ein benutzerdefinierter Whitelist-Parser liest Ihre Formel — kein JavaScript eval — daher werden nur die aufgelisteten Funktionen (sin, cos, tan, sqrt, abs, exp, log, pow), die Konstanten pi und e sowie die beiden Variablen x und y akzeptiert. Alles andere wird vor der Ausführung verworfen. Gute Startpunkte sind die Voreinstellungen, etwa sin(x)*cos(y) für ein rollendes Wellenfeld oder x^2 - y^2 für einen klassischen Sattel.