So da ich mich gerade ein weniger genauer mit dem Canvas Element auseinandersetze, habe ich da
schon die erste Frage an euch. Wieso funktioniert denn sowas nicht?
JavaScript
function main() {
// canvas -> Canvas Element
// ctx -> Context vom Canvas Element(2d)
var canvas = document.getElementById("pong");
if (canvas.getContext) {
var ctx = canvas.getContext("2d");
//Zeichnen des angepassten Canvas-Elements mit Hintergrundfarbe
drawCanvas(canvas,ctx);
//Erstellen des Ball-Objekts
var ball = createBall(ctx);
ball.draw();
}
}
function createBall(ctx) {
/*
* ctx -> Inhalt des zu zeichnenden Elements
* erstellt den Ball und gibt ihn zurück
*
*
* x -> X-Koordinate im Canvas
* y -> Y-Koordinate im Canvas
* r -> Radius des Balles
* c -> Farbe des Balles
* vx -> Geschwindigkeit in x Richtung
* vy -> Geschwindigkeit in y Richtung
*
* draw() -> Zeichnet den Ball im Canvas-Element
*/
var ball = {
//Zustandsvariablen
x: 50,
y: 50,
vx: 3,
vy: 6,
//Fixe Variablen
r: 5,
c: "white",
//Methoden
draw: function() {
//Beginne den Pfad
ctx.beginPath();
//Farbe definieren
ctx.fillStyle = this.c;
//Kreis zeichnen
ctx.arc(this.x,this.y,this.r,0, Math.Pi*2, false);
//Kreis färben
ctx.fill();
}
}
//gibt das Objekt zurück
return ball;
}
Alles anzeigen
Das Ball-Objekt wird richtig erzeugt und auch alle Daten stimmen.
Die Methode wird auch richtig aufgerufen und ausgeführt, nur
findet keine Ausgabe des Balls im Canvas statt, mag mir wer auf die Sprünge helfen?
mfg Nita
Edit:
Hat sich erledigt, die Funktion Math.PI ist scheinbar case-sensitive