Canvas - changer source de l'image au clique

- 10 juin 2018 à 16:19 - Dernière réponse :
Messages postés
1663
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
3 novembre 2018
- 10 juin 2018 à 23:31
Bonjour,

Je cherche à changer la source d'une image affiché dans un canvas au clique, mais je n'y arrive pas:

var c = document.getElementById("rendu");
var ctx = c.getContext("2d");

var skin = new Image();
skin.onload = draw;
skin.src = "../assets/sprites/character/skin/"+document.getElementById('sex').getAttribute('value')+"/skin/"+document.getElementById('skin').getAttribute('value')+".png";


var button = document.getElementById("button");

button.addEventListener("click", function() {
skin.src = "../assets/sprites/character/skin/female/skin/"+document.getElementById('skin').getAttribute('value')+".png";
skin.onload = draw;
});


function draw(){
ctx.drawImage(this, 0,128,64,64,0,0,64,64);
ctx.drawImage(this, 0,0,64,64,64,0,64,64);
ctx.drawImage(this, 0,64,64,64,128,0,64,64);
ctx.drawImage(this, 0,192,64,64,192,0,64,64);

}


Mais avec ce code ça ne fonctionne pas, comment faire ?

Merci
Afficher la suite 

Votre réponse

1 réponse

Messages postés
1663
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
3 novembre 2018
- 10 juin 2018 à 23:31
0
Merci
bonjour

met un console.log dans la fonction draw afin de voir ce que renvoi this

console.log(this)

Commenter la réponse de @karamel

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.