Bonjour,
Ce jeu est souvent présenté comme un "tour de magie".
Pour un informaticien (même débutant), il n'y a pourtant rien de prodigieux !
En effet, pour chaque carte présentée, on demande (indirectement) si le i-ième chiffre binaire du nombre à deviner est 0 ou 1 (absent ou présent sur la carte).
Il suffit donc de faire la sommes des premiers nombres des cartes sur lesquelles figure l'entier à deviner.
Voici un code qui permet de dessiner une carte:
function DrawCarte(K,X,Y) { // K=1,2,4,8,16,...; X,Y=position
var x=X-24,y=Y-30,dx=16+nCol*wCol,dy=hCrt+24,xx=x+dx,yy=y+dy,w=X,s;
var g=ctx.createLinearGradient(x,y,xx,yy);
g.addColorStop(0,'#FFFF77'); g.addColorStop(1,'#FFBBFF');
ctx.beginPath(); ctx.moveTo(x+R,y); //|
ctx.arcTo(xx,y,xx,y+R,R); ctx.arcTo(xx,yy,xx-R,yy,R); //| rectangle arrondi
ctx.arcTo(x,yy,x,yy-R,R); ctx.arcTo(x,y,x+R,y,R); //|
ctx.fillStyle=g; ctx.fill(); ctx.fillStyle='black';
if (T>0) {ctx.lineWidth=T; ctx.stroke();} // contour au trait
for (var n=1,m=0; n<=N; ++n)
if (n&K) { // le nombre n appartient à la carte K
ctx.fillText(s=n.toString(),w-ctx.measureText(s).width/2,Y);
if ((++m)<nCol) w+=wCol; else {m=0; w=X; Y+=hLin;}
}
}
K est le premier nombre de la carte.
Le test
if (n&K) {...} suffit pour déterminer si le nombre
n figure sur la carte
K.
Adaptez les couleurs dans les deux instructions
g.addColorStop().
La fonction
Param permet de lire et tester une nouvelle valeur.
Elle est accéptée si c'est un nombre entier entre limInf et limSup.
Sinon, l'ancienne valeur est réactivée:
function Param(val,ele,limInf,limSup) { // ...
var i=parseInt(ele.value);
if ((i==NaN)||(i<limInf)||(i>limSup)) ele.value=''+(i=val);
return i;
}
ele est l'élément correspondant à une zone
input.
Remarquez la manière très simple de copier un
canvas dans une nouvelle fenêtre:
function NewWin() {
var win=window.open('','_blank','width='+(cnv.width+20)+
',height='+cnv.height+',scrollbars=1,resizable=1,replace=1');
win.document.write('<img src="'+cnv.toDataURL()+'"/>');
}
Le
zip ne comporte qu'un seul fichier
CartesBin.html qui permet d'obtenir beaucoup de variantes de ce jeu.
Après avoir modifié des paramètres, cliquez sur le bouton
Draw pour afficher le résultat.
Avec le bouton
New window, on peut ainsi récupérer l'image (et p.ex. l'imprimer et la découper).
Testé avec les dernières versions de:
Chrome, Edge, Explorer, Firefox, Opera, Safari.
Bonne lecture ...
Quelques liens:
La magie binaire
Binary Magic Trick
Un petit tour de magie pour se distraire ...
Cartes magiques
Récréomath: Cartes binaires
CARTES MAGIQUES
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.