Scheinbare Bahn der Sonne



Das Beispiel kann nicht funktionieren, weil ihr Browser keine Javascript-Programme ausführen darf.

Die Vertikale Skala zeigt den Höhen-Winkel ( Altitude) in Grad. Der Nullpunkt liegt am Horizont, der Winkel nimmt bis zum Zenith auf maximal 90° zu.
Negative Höhenwinkel zeigen an, wie weit die Sonne unter dem Horizont steht. Bei Sonnenhöhe -6°...0° herrscht 'Bürgerliche Dämmerung', bei -12°...-6° 'Nautische Dämmerung'.

Die zur Beschreibung eines Raumes notwendige 3. Koordinate ist die (für die Erde fast konstante) Entfernung zur Sonne (ca. 150 Mio km).

Astronomische Koordinaten-Systeme

Diagramm

Das Diagramm zeigt die Bahn der Sonne unter den gewählten Bedingungen. Die → SVG Objekt-Grafik wird von allen modernen Browsern korrekt angezeigt.

Der Algorithmus ist stark vereinfacht und liefert in dieser Form (nur) für die Nord-Halbkugel der Erde brauchbare Daten.

Berechnung und Grafik sind in einer eigenständigen Mini-Webseite (Web-App) enthalten.
Mit diesem Link kann man die ↗ Mini-Webseite + Grafik in einem eigenen Browser-Tab laden. Die Web-App ist derzeit nicht mobil-freundlich, weil sie zu viele Details für den kleinen Bildschirm eines SmartPhones enthält. Eine vereinfachte mobil-freundliche Version ist in Arbeit.



Das Beispiel ist als eigenständige Mini-Webseite programmiert. Dabei werden die Web-Technologien → HTML (Webseite), → SVG (Grafik), → CSS (Formatierung) und → Javascript (Programmierung) verwendet. Vergleichbare als Smartphone-Apps programmierte Lösungen benötigen ca. den 100fachen Speicherplatz.

Alle verwendeten Resourcen sind in der Datei enthalten. Man kann daher den ↗ Quelltext in einer Datei *.html am eigenen Arbeits-PC speichern und verwenden.

Der HTML-, SVG- und CSS-Code ist auch mit bescheidenen Kenntnissen verständlich. Javascript verwendet zur Berechnung das Klassen-ähnliche (portable) Objekt sunobj, welches zum Verständnis fortgeschrittene Kenntnisse erfordert.


Alternativ kann man die Mini-Webseite auch mit → HTTP-GET-Argumenten steuern. Dazu öffnen sie die ↗ Mini-Webseite in einem eigenen Browser-Tab. Beachten sie die Adresszeile des Browsers: Nach der Angabe des Pfades
http://...sun_path.svg
folgt ein ? Fragezeichen, danach 3 durch &-Zeichen getrennte GET-Argumente in der Form name=wert
Man kann die Zahlenwerte der GET-Argumente manuell ändern und mit der Return-Taste eine erneute Berechnung veranlassen: So kann man diese Web-App auch ohne Formular manuell steuern.

HTML-Einbettung


So ist die Mini-Webseite mit Grafik hier eingebettet (vereinfacht):
<iframe id="if1" name="if1" src="sun_path.svg">
</iframe>
Tipp: Fügen sie ein style-Attribut mit Angabe der Eigenschaften width und height ein.


Mit diesem Formular (vereinfacht) wird die Grafik gesteuert:
<form id="f1" name="f1" method="get" action="sun_path.svg" target="if1" onchange="validate_date()">
<input type="text" name="lon" />
<input type="text" name="lat" />
<input type="text" name="date" />
</form>

SVG + Javascript-Quelltext der Objekt-Grafik

◀   Der Quelltext der oben eingebetteten Mini-Webseite mit Objekt-Grafik enthält in knapp 650 Zeilen 40% → SVG-Code, 55% → Javascript-Code und 2.5% → CSS-Code.

• Der SVG-Code enthält unerwartet viele Elemente: Allein die Y-Achse besteht aus 39 Elementen, die X-Achse aus 66 Elementen.
Die rote Linie der Sonnen-Bahn ist aus 53 Linien-Segmenten zusammengesetzt, deren Koordinaten von der Javascript-Funktion draw_sun_path() nach dem Ergebnis der Berechnung geändert werden.

• Der Javascript-Code ist relativ komplex und erfordert fortgeschrittene Kenntnisse zum Verständnis. Nach dem vollständigen Laden des Dokuments (onload-Ereignis) werden 2 Arbeiten ausgeführt:
• Die vom User erhaltenen GET-Argumente werden ausgewertet.
• Die Grafik wird neu gezeichnet.

• Zur Auswertung von HTTP-GET-Argumenten verwendet man meist Programme (Java, Perl, PHP, Python, ...), die am Server-PC ausgeführt werden. Hier wird die → Decodierung der GET-Argumente mit Javascript ausgeführt. Das ist vorteilhaft, wenn ein Dokument wiederholt mit verschiedenen Argumenten angefordert wird:
Mit Javascript wird das Dokument nur 1mal vom Webserver angefordert und danach am Client-PC wesentlich schneller berechnet, als mit Server-Programmen (inkl. Übertragungs-Zeiten) möglich wäre.

• Zur Anpassung der Grafik an verschiedene Anforderungen werden die Eigenschaften (XY-Koordinaten) von 53 <line>-Elementen mit der Javascript Funktion draw_sun_path() Live geändert. Sie ist im Quelltext kommentiert, daher sollte der grundsätzliche Ablauf verständlich sein.

• Die Algorithmen (Rechen-Regeln) sind im portablen Objekt sunobj enthalten. Sie liefern (derzeit nur) für die Nord-Halbkugel der Erde brauchbare Werte. Zum Verständnis braucht man entweder Amateur-astronomische oder gute geometrische Kenntnisse.
Zuerst werden für jeden Zeitpunkt die äquatorialen Koordinaten (Deklination, Rektaszension) berechnet. Die Rektaszension wird um die lokale Sternzeit zum Stundenwinkel korrigiert.
Danach werden die äquatorialen Koordinaten in das individuelle horizontale Koordinaten-System des jeweiligen Ortes (Azimuth, Altitude) transformiert.

Der ↗ Quelltext der SVG Objekt-Grafik ist offen, die Berechnung jedoch ohne Gewähr. Man kann ihn in einer Datei *.svg am eigenen PC speichern und beliebig verwenden.