{"id":1012,"date":"2021-03-29T05:55:35","date_gmt":"2021-03-29T03:55:35","guid":{"rendered":"http:\/\/labodemaths.fr\/WordPress3\/?p=1012"},"modified":"2021-03-29T10:46:11","modified_gmt":"2021-03-29T08:46:11","slug":"nsi-projet-jeu-de-la-vie","status":"publish","type":"post","link":"https:\/\/labodemaths.fr\/WordPress3\/nsi-projet-jeu-de-la-vie\/","title":{"rendered":"NSI : projet jeu de la vie"},"content":{"rendered":"\n

Information MPI<\/h2>\n\n\n\n

https:\/\/prepas.org\/index.php?article=42<\/a><\/p>\n\n\n\n

1. Pr\u00e9sentation du jeu de la vie.<\/h3>\n\n\n\n

Une pr\u00e9sentation au coll\u00e8ge de France par J-P Delahaye :
https:\/\/www.college-de-france.fr\/site\/alain-prochiantz\/symposium-2017-09-06-11h00.htm<\/a>
un article :
http:\/\/www.lifl.fr\/~jdelahay\/dnalor\/Jeudelavie.pdf<\/a><\/p>\n\n\n\n

2. Le code HTML<\/h3>\n\n\n\n
<HTML>\n\t<HEAD>\n\t\t<meta charset=\"utf-8\" \/>\n\t<\/HEAD>\n\t<BODY>\n\n\t\t\t<canvas id=\"canvas\" width=\"600px\" height=\"600px\"><\/canvas>\n        <form>\n            <div>\n               <label for=\"b1\">Lancer la simulation en mode pas \u00e0 pas :<\/label> \n        <input id=\"bouton\" type=\"button\" value=\"Ok\">\n            <\/div>\n            <div>\n                <label for=\"b2\">Lancer la simulation en mode automatique :<\/label> \n        <input id=\"bouton_auto\" type=\"button\" value=\"Lancer la simulation automatique\">\n            <\/div>\n            <\/form>\n\t<\/BODY>\n\n<\/HTML>\n<script type=\"text\/javascript\" src=\"prog.js\"><\/script><\/code><\/pre>\n\n\n\n
3. Le code JS<\/h3>\n\n\n\n
var canvas=document.getElementById(\"canvas\");\nvar ctx=canvas.getContext(\"2d\");\nvar dimension=10;\nvar plateau=new Array();\nvar plateau_transitoire=new Array();\ncanvas.addEventListener(\"mousedown\",changer_case , false);\nbouton_r=document.getElementById(\"bouton\");\nbouton_r.onclick=evolution;\nbouton_auto=document.getElementById(\"bouton_auto\");\nbouton_auto.onclick=evolution_auto;\n\n\nremplir_tableaux();\nafficher();\n\nfunction remplir_tableaux(){\n\/\/ on ajoute des lignes \u00e0 nos tableaux\n    for (var i=0;i<dimension;i++) {\n        plateau[i]=new Array();\n        plateau_transitoire[i]=new Array();\n        }\n\/\/ on remplit les 2 tableaux de 0\n    for (var i=0;i<dimension;i++) {\n        for (var j=0;j<dimension;j++) {\n        plateau[j][i]=0;\n        plateau_transitoire[i][j]=0;\n        }\n    }\n}\n\nfunction afficher(){\n    var canvas=document.getElementById(\"canvas\");\n    var cote=canvas.width\/dimension;\n    for (var i=0;i<dimension;i++) {\n        for (var j=0;j<dimension;j++) {\n        if (plateau[j][i]==0) {\n            ctx.beginPath();\n            ctx.strokeStyle=\"dark\";   \n            ctx.lineWidth=\"2\";   \n            ctx.rect(i*cote,j*cote,cote,cote);\n            ctx.fillStyle=\"rgb(255,255,255)\";\n            ctx.fill();\n            ctx.stroke();   \n        }\n        else {\n            ctx.beginPath();\n            ctx.rect(i*cote,j*cote,cote,cote);\n            ctx.fillStyle=\"rgb(0,0,0)\";\n            ctx.fill();\n        }\n        }\n    }\n}\nfunction changer_case(evt){\n    var mousePos = getMousePos(canvas, evt);\n    var x=mousePos.x;\n    var y=mousePos.y;\n    var cote=canvas.width\/dimension;\n    i=Math.floor(x\/cote);\n    j=Math.floor(y\/cote);\n    if (plateau[j][i]==0){\n        plateau[j][i]=1;\n    }\n    else {\n        plateau[j][i]=0;\n    }\n    afficher();\n}\nfunction getMousePos(canvas, evt) {\n         var rect = canvas.getBoundingClientRect();\n         return {\n           x: evt.clientX - rect.left,\n           y: evt.clientY - rect.top\n         };\n       }\nfunction compteur(i,j){\n    var nb=0;\n    for (var x=i-1;x<i+2;x++){\n        for (var y=j-1;y<j+2;y++){\n            if ((x>=0) && (x<dimension) && (y>=0) && (y<dimension) && !((x==i)&&(y==j))){\n                nb+=plateau[y][x];\n            }\n         }\n       }\n    return nb;\n}\n\nfunction evolution() {\n    mise_a_jour_transition();\n     for (var i=0;i<dimension;i++) {\n        for (var j=0;j<dimension;j++) {\n            c=compteur(i,j);\n            if ((plateau[j][i]==0) && (c==3)) {\n                plateau_transitoire[j][i]=1;\n                }\n            if (plateau[j][i]==1) {\n                if ((c==2)||(c==3)){\n                plateau_transitoire[j][i]=1;\n                }\n            else {\n                plateau_transitoire[j][i]=0;\n            }\n        }\n  }\n}\n    mise_a_jour_plateau(); \n    afficher();\n  \n}\nfunction evolution_auto(){\n    evolution();\n    setInterval(evolution, 1000);\n}\nfunction mise_a_jour_transition(){\n    for (var i=0;i<dimension;i++) {\n        for (var j=0;j<dimension;j++) {\n            plateau_transitoire[j][i]=plateau[j][i];\n        }\n    }\n}\n\nfunction mise_a_jour_plateau(){\n    for (var i=0;i<dimension;i++) {\n        for (var j=0;j<dimension;j++) {\n            plateau[j][i]=plateau_transitoire[j][i];\n        }\n    }\n}<\/code><\/pre>\n\n\n\n
4. Tester la page HTML et analyser le code.<\/h3>\n\n\n\n
5. Mini Projet pour avant les vacances<\/h3>\n\n\n\n
Modifier le js et le html pour proposer des am\u00e9liorations au client :<\/p>\n\n\n\n