CodeAgeBy Sitezack
Canvas für MacherZeichne und animiere dein Spiel0 XP
Kapitel-Fortschritt0/6

Lektion 4 von 7

Das Auto bewegen

Zum Animieren ändert man die Daten (car.x) und zeichnet alles neu: Löschen mit clearRect, dann das Auto an der neuen Position zeichnen.

Packe das in zwei Funktionen: drawCar() zeichnet, moveCar(dx) verschiebt und zeichnet neu.

function moveCar(dx) {
  car.x = car.x + dx;
  ctx.clearRect(0, 0, 300, 200);
  drawCar();
}

🎯 Dein Ziel

Schreibe die Funktion drawCar(), die das Auto bei car.x, car.y zeichnet, und die Funktion moveCar(dx), die dx zu car.x addiert, das Canvas löscht und drawCar() erneut aufruft.

PRO-Lektion

Dieses fortgeschrittene Kapitel gehört zu CodeAge PRO. Schalte es frei, um dein Abenteuer fortzusetzen.

PRO entdecken