Bonjour,

délicat de trouver un titre explicite, ma question ne semble pas trouver beaucoup de réponses sur le net..

Je réalise une application du type dessin dans le navigateur (pour des seances d'entrainement de foot), je pars donc sur une balise canvas, une seule largeur de trait et différentes couleurs, de ce coté la pas de soucis.

J'ai également besoin de pouvoir insérer des images au clic utilisateur, ça j'ai aussi réussi a trouver la technique..

La ou ca devient un peu plus costaud.. C'est quand il faut pouvoir faire du drag and drop sur ces images insérées de façon dynamique dans le canvas, pour pouvoir les placer plus précisément...

j’insère mon image comme ceci :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
	  var img_elem = new Image();
 
	  img_elem.addEventListener('load', function () {
		context.drawImage(this, mouseX, mouseY);
	  }, false);
	  img_elem.src = img;

j'ai essayé de rajouter un "img_elem.draggable = true;", vu qu'a priori, en HTML5, c'est juste cet attribut a rajouter.. Mais ça ne change rien..

Auriez vous des pistes ou des infos sur le sujet ? Je tourne sur google depuis un moment et je tombe a chaque fois sur le même genre d'infos.. Soit du dessin, soit du drag and drop, mais rien qui s'applique a ce cas la... je suis un peu bloqué !

Merci d'avance aux experts !