M1202 - TP Séance 3
Durée : 2h00
Objectifs
- Traduire un algorithme en pseudo-code en un programme Javascript
- Ecrire un programme de dessin en Javascript en utilisant quelques algorithmes de base
Au menu
- Consignes
- Conception d'un algorithme de dessin
- Conception d'un jeu de voyance
- Bonus : dessin d'une spirale
A. Consignes (5 min) ↑
Lisez attentivement cet énoncé de TP/TD
en suivant les instructions.
En cas d'interrogation,
faites appel à moi,
que ce soit pour en savoir plus sur un des points abordés pendant le TP, ou
pour savoir comment effectuer une des tâches demandées (numérotées pour pouvoir
y faire référence simplement).
Surtout
ne restez pas bloqué(e) sur une des questions.
Entre parenthèses, à côté des titres de sous-sections, est indiqué
le temps que vous avez dû passer à effectuer les étapes précédentes.
Cinq minutes avant la fin du TP, pensez à remplir ce questionnaire à propos de votre avancée, où vous devrez aussi coller des extraits de votre code. Si vous avez besoin de récupérer des fichiers dans votre dossier personnel à l'université, vous pouvez utiliser l'environnement numérique de travail et choisir le menu « Informations pratiques », « Mes fichiers » pour aboutir à
cette page web qui vous permettra de les télécharger un par un sur votre ordinateur.
B. Conception d'un algorithme de dessin (45 min) ↑
Finissez le
TP2, en particulier les questions
D1,
D2 et
D3 pour aboutir au dessin d'un échiquier comme demandé.
Si vous avez oublié de faire ce qui était demandé en rouge au début du TP2,
faites-le immédiatement au début du TP d'aujourd'hui !
C. Conception d'un jeu de voyance (70 min) ↑
Finissez le
TP1, en allant bien jusqu'à la question où c'est vous qui choisissez un
nombre, et c'est l'ordinateur qui essaie de deviner et vous demande si c'est le bon nombre.
D. Bonus : dessin d'une spirale (60 min) ↑
D1Écrivez un algorithme en Javascript capable de dessiner cette spirale, en dessinant
d'abord les carrés, puis les diagonales, montrées dans le dessin ci-dessous.
Vous enlèverez ensuite les carrés pour n'avoir que les diagonales.
Puis, pour obtenir une réelle spirale (avec des courbes plutôt que des lignes droites) :
- D2regardez le code de l'algorithme dessineLigne de votre fichier M1202-TP2.html pour comprendre comment il fonctionne pour manipuler un élément HTML canvas à l'aide des algorithmes beginPath, moveTo, lineTo et stroke.
- D3remplacez le dessin d'une ligne droite par le dessin d'une courbe avec les bons paramètres en utilisant l'algorithme Javascript bezierCurveTo.