Bonjour,
Je voudrais remplacer alert(images[i].textContent); par :
Le problème, le return i; ne fonctionne pas dans la fonction Click, ou bien une erreur sur :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2 ctx.font = "30px Arial"; ctx.fillText(images[Message].textContent,200,200);
Dois-je faire une fonctionne d'affichage.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4 Message=canvas.addEventListener("click", Click, false); ctx.font = "30px Arial"; ctx.fillText(images[Message].textContent,200,200);
Je ne comprend pas pourquoi, je peux pas afficher un message quand je clique sur une image
voici le programme et merci encore
http://ia.jenny.free.fr/Img/
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63 var NbrImg; var images; var Message; // -------------------------------------------------------------------------------------- window.onload = function() { getXML("text2.xml", drawImages); } // -------------------------------------------------------------------------------------- function getXML(url, callback) { const oXhr = new XMLHttpRequest(); oXhr.onreadystatechange = function() { if (this.readyState === 4 && this.status === 200) { callback(this.responseXML); } }; oXhr.open("GET", url, true); oXhr.send() } // -------------------------------------------------------------------------------------- function drawImages(docXML) { const canvas = document.getElementById("canvas"); const ctx = canvas.getContext("2d"); canvas.width = 1400; canvas.height = 600; images = docXML.querySelectorAll("Img"); for (let i=0; i<images.length; i++) { const oImage = new Image(); oImage.onload = function() { ctx.drawImage(oImage,i*105,0,100,100); }; oImage.src = "Img/"+ images[i].textContent+".jpg"; } NbrImg=images.length; Message=canvas.addEventListener("click", Click, false); // <---------- Err ????? ctx.font = "30px Arial"; ctx.fillText(images[Message].textContent,200,200); } // -------------------------------------------------------------------------------------- function Click(e) { var x = e.clientX; var y = e.clientY; for (let i=0; i<NbrImg; i++) { if(x>i*105 && x<i*105+100 && y>1*105 && y<1*100+100 ) { //alert(images[i].textContent); //return i; // <---------- Err ????? } } } // --------------------------------------------------------------------------------------
Partager