Projet NSI : JavaScript

Fermé
daasosus - 14 juin 2020 à 10:46
yg_be Messages postés 22720 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 23 avril 2024 - 14 juin 2020 à 11:04
Bonour, je suis en premiere, et dans le cadre d'un projet, j'ai un code JS a rediger.

Voici le sujet :

Notre mini projet permet d’illustrer les modifications que peuvent provoquer les actions de l’utilisateur.
On va se restreindre à une seule action à l’intérieur d’un contexte graphique pour simplifier les choses.
À l’intérieur d’un rectangle défini par le fichier HTML, il doit s’afficher un disque de couleur à la position du pointeur de la souris à chaque clic de l’utilisateur à l’intérieur de ce rectangle.

Amélioration n°1
Pour ne pas surcharger le rectangle, on n’autorise que 5 disques à la fois en effaçant le plus anciens.

Amélioration n°2
On laisse le choix à l’utilisateur du nombre de disques.

Amélioration n°3
On laisse le choix à l’utilisateur de la couleur des disques.

Amélioration n°4
On laisse le choix à l’utilisateur de la couleur du fond du rectangle


Et voici le code auquel je suis parvenu pour le moment :

`<!DOCTYPE html>
<html>
<head>
<title>projet nsi</title>
<meta charset='utf-8'>
<link rel='stylesheet' type="text/css" href='css/projet.css'/>
<script type="text/javascript" src="projet.js"></script>
</head>
<body>
<h1>Rectangle magique</h1>
<div id="rectangle" >
<button id="bouton">Click!</button>
<span id="canvas1">0</span>

</div>




</body>
</html>


Et pour le JS :

let compteur = 0
function circle()
{
var canvas = document.getElementById("canvas1");
var context = canvas.getContext("2d");
context.beginPath();
context.lineWidth="2";
context.arc(100, 100, 90, 0, 2 * Math.PI);
context.stroke();
}


function suivant() {
compteur = compteur + 1;
let v = document.getElementById("canvas1");
v.innerHTML = compteur
}

let b = document.getElementById("bouton")
b.addEventListener("click",suivant)

Je n'ai pas encore adapté les fonctions au programme, je me suis contenté pour le moment de rassembler les idées.

Si vous avez une idée quant a la demarche a suivre, n'hesitez pas a m'en faire part.

Merci.
A voir également:

1 réponse

yg_be Messages postés 22720 Date d'inscription lundi 9 juin 2008 Statut Contributeur Dernière intervention 23 avril 2024 1 476
14 juin 2020 à 11:04
0