Snap! nutzt ein Koordinatensystem, welches sich am Modell der vier Quadranten orientiert: Sowohl die x- als auch die y-Koordinaten können negative und positive Werte annehmen. So können in der Grundeinstellung x-Werte von -240 (links) bis 240 (rechts) abgebildet werden, die y-Werte sind von 180 (oben) bis -180 (unten) sichtbar. Der Koordinatenursprung liegt also im Zentrum.
Dies im Gegensatz zu vielen anderen Programmiersprachen, wo der Koordinatenursprung (0, 0) häufig in der oberen linken Ecke liegt.
Wie gross der abgebildete Bereich tatsächlich ist, kann über die Einstellung zur Bühnengrösse (stage) festgelegt werden.
Diese Darstellung der Koordinaten und die unterschiedlichen Bildschirmgrössen in Snap! sollte man bei der Programmierung entsprechender Grafiken berücksichtigen. Sonst werden beispielsweise Grafiken mit ausschliesslich positiven Koordinaten nur in einem Viertel des Bildschirms dargestellt.
Noch vertrackter wird es, wenn man während der Programmierung die Auflösung ändert oder es mit sehr grossen oder kleinen Zahlen zu tun hat. Dann muss man jedes Mal die entsprechenden Koordinaten umrechnen.
Dies von Hand zu tun ist nur eine Lösung, welche sinnvoll ist, wenn man Snap! kaum jemals für die Darstellung von Daten benötigt. Bei häufigerer Verwendung liegt es nahe, eine entsprechende Umrechnungsroutine in Snap! selbst zu schreiben.
Schülerinnen und Schüler scheitern meist daran, dass dies keine ganz einfache Aufgabe ist. Die folgenden Schritte erklären, wie man zu einer Lösung kommt, welche solche Darstellungsprobleme endgültig beseitigen. Dabei lohnt es sich, schrittweise vorzugehen.
Im einfachsten Fall beginnen sowohl der Datenbereich als auch die Bildschirmdarstellung bei 0, wie die folgende Grafik zeigt.
Der Datenbereich in der Grafik reicht von 0 bis 6, auf dem Bildschirm können die Werte 0 bis 12 abgebildet werden. Um die Zahlen von einer Menge in die andere umzurechnen, vergleichen wir die Spannweiten der beiden Bereiche. Die Spannweite auf dem Bildschirm ist doppelt so gross wie die Spannweite des Datenbereiches. Es genügt in diesem Fall also, alle Datenwerte mit 2 zu multiplizieren, um die korrekte Position auf dem Bildschirm zu erhalten, wir erhalten also folgende Werte:
- 0 ⟶ 0 (kleinster Wert)
- 6 ⟶ 12 (grösser Wert)
- 2 ⟶ 4 (grüner Punkt)
Etwas kompliziert wird es, wenn der Datenbereich nicht bei 0 beginnt, dann muss die Umrechnung angepasst werden:
Aus der Grafik erkennen wir sofort, dass die Umrechnung des Wertes für den grünen Punkt nicht mehr durch eine einfache Multiplikation erfolgen kann, weil dieser bei den Daten in der Nähe des grössten Wertes liegt, während dies in der Abbildung definitiv nicht der Fall ist. Eine kurze Überprüfung anhand der Extremwerte zeigt, was zu tun ist:
- -2 ⟶ -4 statt 0
Differenz zum tatsächlichen Wert: -4 - 4 ⟶ 8 statt 12
Differenz zum tatsächlichen Wert: -4
Die Differenz des kleinsten Wertes aus dem Datenbereich beträgt aber nur -2, die -4 ergeben sich erst mit der erneuten Multiplikation: Die Werte aus dem Datenbereich müssen also zuerst multipliziert werden und dann um den mit dem gleichen Faktor multiplizierten Unterschied zwischen dem Minimum der Daten und Null korrigiert werden. So erhalten wir:
- -2 ⟶ -4 + 4 = 0 (kleinster Wert)
- 4 ⟶ 8 + 4 = 12 (grösser Wert)
- 2 ⟶ 4 + 4 = 8 (grüner Punkt)
Nun ist es aber auch möglich, dass der Bildschirmbereich gegenüber dem Nullpunkt so wie bei Snap! verschoben ist.
Wieder helfen die Minimal- und Maximalwerte weiter, um zu verstehen, was für eine zusätzliche Korrektur notwendig ist.
- -2 ⟶ 0 statt -2 (kleinster Wert)
Differenz zum tatsächlichen Wert: -2 - 4 ⟶ 12 statt 10 (grösser Wert)
Differenz zum tatsächlichen Wert: -2
Bei der letzten Korrektur muss also noch die Differenz vom Minimum des Bildschirms zum Nullpunkt berücksichtigt werden.
Eine Überprüfung ergibt:
- -2 ⟶ -4 ⟶ 0 ⟶ -2 (kleinster Wert)
- 4 ⟶ 8 ⟶ 12 ⟶ 10 (grösster Wert)
- 2 ⟶ 4 ⟶ 8 ⟶ 6 (grüner Punkt)
Hier noch einmal die ganzen Ausführungen als Erklärfilm:
Für die Abbildung eines beliebigen Datenpunktes auf dem Bildschirm gilt deshalb folgende Formel:
Datenwert x Quotient der Differenzen + Differenz vom minimalen Datenwert zum Nullpunkt multipliziert mit dem Quotienten der Differenzen + Differenz vom minimalen Bildwert zum Nullpunkt
In Snap! kann ein entsprechender Block so geschrieben werden, wobei einige Hilfsvariablen die Sache erleichtern:
Greifen wir dazu noch einmal das Beispiel der Quadratzahlen auf, deren Bildpunkte beim ersten Versuch alle im 1. Quadraten landeten. Die Umrechnung kann entweder beim Zeichnen der Grafik oder schon anhand der darzustellenden Daten erfolgen.
Der erste Block in der Grafik (grau) führt die eigentliche Umrechnung für einen Wert aus.
Der zweite Block (blau) liefert die Breite der Bühne (Bildschirm) zurück. Eine entsprechende Möglichkeit gibt es für die Bildschirmhöhe. Dieser Wert muss durch 2 geteilt werden, da die Differenz des minimalen und maximalen Wertes doppelt so gross ist wie der Abstand des Minimalwertes zum Ursprungspunkt.
Der dritte Befehl (orange) nimmt als Argument eine Liste entgegen und wendet dann auf jedes Element die Befehle an, die im grauen Ring enthalten sind.
Der vierte Block (ebenfalls orange) wählt das angegebene Element aus einer Liste aus.
Der grosse Block führt deshalb folgende Befehle aus:
- Der Datensatz wird genommen und in zwei Teillisten mit der ersten und zweiten Spalte aufgeteilt.
- Für beide Spalten werden alle enthaltenen Werte gemäss den Parametern im Umrechnungsblock so berechnet, dass diese auf den Bildschirm passen.
- Damit die Daten nicht am Rand des Bildschirms landen, wurden bei den Daten ein etwas grösserer Bereich angegeben. So ist es dann allenfalls noch möglich, die Grafik mit zusätzlichen Informationen (Titel, Achsen, Legenden) anzureichern.
Hält man sich an dieses Vorgehen, können Daten auf einem beliebig grossen Bildschirm passend ausgegeben werden. Ausprobieren kann man dies unter Daten umrechnen. Dazu klickt man nach dem Öffnen auf die Schaltfläche „see code“. In der eingebundenen Version unten klickt man stattdessen auf das Augensymbol oben links.