Introduction à la programmation graphique avec HTML5
Dans cet atelier apprenez tout ce qui est nécessaire pour commencer la programmation de jeux vidéo web avec HTML5.
Construisez une structure de code réutilisable pour tous vos projets : simple, lisible et évolutive !
Je vous explique tout et vous codez avec moi, pas à pas, pour parfaitement assimiler les concepts nécessaire :
- Créer une gameloop
- Afficher une image
- Gérer le deltatime
- Créer un objet “sprite”
- Recevoir les événements du clavier
Adhérez aujourd'hui
Gamecodeur c’est à partir de 8 € / mois (facturé annuellement)
Comments (6)
Y à un bug dans le potage David 🙂
let canvas = document.getElementById(“canvas”);
let ctx = canvas.getContext(“2d”);
let img = newImage();
img.src (“PNoel.png”);
….
….
la ligne 2 me renvoi:
TypeError: null is not an object (evaluating ‘canvas.getContext’)
Je précise que je suis sur Mac, y à pas de raison normalement…
C’est un soucis avec ta ligne d’avant :
let canvas = document.getElementById(“canvas”);
“null is not an object” te dit que ta variable canvas est nulle.
Donc ton HTML ne doit pas contenir de canvas avec comme id “canvas”.
Aucun rapport avec Mac ou PC.
Merci David, et dire que j’ai installé Opéra pour voir la même erreur…
Mon image s’est enfin affichée, ouf 🙂
On veut la suite ! Trop du kiff ce tuto, un pur plaisir de pouvoir coder un jeu sur navigateur.
Bonsoir David.
Cela fait plusieurs jours que j’ai tout retapé le début très bien mais à la fin j’ai du commettre une erreur car plus d’image du tout et vous dîtes après 25 minutes que vous nous mettez à disposition les fichiers pour comparer et justement vérifier mais je ne trouve pas ces fichiers pouvez-vous me dire où ils sont. Bien cordialement. Merci par avance. JPM
Cet atelier a été totalement remis à jour en mars 2021. Tu as maintenant accès aux sources et les explications sont plus détaillées.