Canvas: Seaworld - JirkaDellOro/EIA2 GitHub Wiki

Zeichnen Sie das Bild einer noch unbewegten Unterwasserlandschaft. Im Hintergrund sollen sich Wasser, am Boden Sand und Kies, Wasserpflanzen und Zierobjekte befinden, im Vordergrund natürlich Fische und Getier verschiedener Art und Luftblasen. Die einzelnen Motive sollen mit Hilfe von selbst implementierten Funktionen gezeichnet werden. Für jedes Motiv soll es eine Funktion geben, welche eine Position und gegebenenfalls weitere Parameter entgegen nimmt und das entsprechende Motiv an der richtigen Stelle zeichnet.

Das Konzept besteht diesmal vordringlich aus Zeichnungen, und zwar eine für das gesamte Bild und mehrere weitere für die einzelnen Motive. Für Aktivitätsdiagramme sind die Abläufe zu trivial. Es muss aber dargestellt werden, welche Parameter die Funktionen entgegen nehmen sollen und welche Bedeutung diese haben bzw. wie sie von der Funktion verarbeitet werden. Die Maße in Pixel müssen den Zeichnungen zu entnehmen sein, zeichnen Sie in passende Koordinatensysteme. Wählen Sie eine gute Canvasgröße, die sich gut auf einem Bildschirm darstellen lässt!

Platzieren Sie mehrere Fische und derlei durch einzelne Funktionsaufrufe im Bild. Planen Sie aber auch Bereiche im Bild, innerhalb derer eine ganze Menge von Luftblasen mit Hilfe von Schleifen und Zufall platziert werden. Somit sieht die Unterwasserlandschaft bei jedem Aufruf ein wenig anders aus. Hierfür ist möglicherweise eine Aktivitätsdiagramm noch hilfreich. Implementieren Sie schließlich auch Funktionen für solche Motivgruppen.

Experimentieren Sie mit den grundlegenden Anweisungen des CanvasRenderingContext2D, beachten Sie die MindMap und die Referenzen darin.

Viel Spaß mit Seaworld!

Inspirationen?

Was man alles mit dem Canvas cooles machen kann: https://github.com/raphamorim/awesome-canvas