2-D Canvas-Grafik/Javascript < Praxis < Informatik < Vorhilfe
|
| Status: |
(Frage) überfällig  | | Datum: | 17:35 Do 05.06.2008 | | Autor: | Scott.y |
| Aufgabe | 2-D Canvas-Grafik (javascript) erstellen (Umdrehung des Mondes um die Erde)
Gegeben sind 3 Klassen:
-------------
Himmelskörper:
-------------
name: String
durchmesser: Number
temperatur: Number
-------------
*
-------------
Himmelskörperkreis:
-------------
himmelskörper: Himmelskörper
mittelpunkt: Punkt
radius: Number
füllfarbe: String
-------------
zeichnen(ctx: Canvas 2D)
-------------
*
-------------
Punkt:
-------------
x: Number
y: Number
-------------
drehenUmUrsprung(drehwinkel: Number)
drehenUmPunkt(drehwinkel: Number, drehpunkt: Punkt)
-------------
*
z.B.: var erde = new Himmelskörper( "Erde", 12714, 288);, wobei "Erde" der Name, 12714 der Durchmesser, 288 die Temp. in Kelvin des Himmelskörper sind.
Über die Temperatur soll man dann noch die Farbe des Planeten bestimmen lassen..
|
Hallo,
ich habe das Erstellen der drei Klassen (glaube) soweit hinbekommen, aber ich verstehe irgendwie nicht, wie diese miteinander verbunden sind. Es wird ja im <body> Element über onload.. die Start Funktion (draw()) aufgerufen, über die dann alles weitere zusammengesucht/ausgeführt wird, wie ich das verstanden haben. So sieht das Skript jedenfalls momentan aus:
---
var Mond;
var Erde;
var erdKreisMittelpunkt = new Punkt(400,300);
var erdKreis = new HimmelskörperKreis(Erde, erdKreisMittelpunkt);
function Himmelskörper(n, d, t){
this.name = n;
this.durchmesser = d;
this.temperatur = t;
}
function Punkt(x,y){
this.x = parseInt(x);
this.y = parseInt(y);
this.drehenUmUrsprung = function(Phi){..
}
this.drehenUmPunkt = function(Phi, Drehpunkt){..
}
}
function HimmelskörperKreis(n, x, y, r, f){
this.himmelskörper = Himmelskörper;
this.mittelPunktX = x;
this.mittelPunktY = y;
this.radius = r;
this.füllFarbe = f;
}
this.zeichnen = function(ctx){
var anticlockwise = false;
ctx.beginPath();
ctx.arc( this.mittelPunktX, this.mittelPunktY, this.radius, 0, Math.PI*2, clockwise);
ctx.closePath();
ctx.fillStyle = this.füllFarbe;
ctx.fill();
}
function draw(){
var canvasElem = document.getElementById("myCanvas");
if (canvasElem.getContext) { // Test, ob Canvas verfügbar ist
c = canvasElem.getContext("2d");
// Planeten erstellen
Mond = new Himmelskörper("Mond", 3475, 218);
Mond.zeichnen(c);
Erde = new Himmelskörper("Erde", 12714, 288);
Erde.zeichnen(c);
// Alle-50ms-Intervallschleife zur Fortbewegung des Himmelskörpers erzeugen
i1 = setInterval("animation()", 50);
}
}
---
Kann mir jemand von euch Tips geben, was das Problem ist, wie man das Ganze besser nachvollziehen kann? Wie ich mir die jeweiligen Himmelskörper baue, ist soweit klar. Aber wo kommen die beiden anderen Klassen ins Spiel? Wie ist z.B. in der zweiten Klasse HimmelskörperKreis die Eigenschaft "himmelskörper: Himmelskörper" gemeint? Die Variable n (Name) aus meiner ersten Klasse Himmelskörper ist ja nicht global.....
Ich sehe leider nicht mehr durch. Eventuell erbarmt sich ja einer von euch.
Danke im Voraus!
Ich habe diese Frage in keinem Forum auf anderen Internetseiten gestellt.
|
|
| |
|
| Status: |
(Mitteilung) Reaktion unnötig  | | Datum: | 18:20 Mo 09.06.2008 | | Autor: | matux |
$MATUXTEXT(ueberfaellige_frage)
|
|
|
|
