Canvas - changer source de l'image au clique

ZauChoco - 10 juin 2018 à 16:19 - Dernière réponse : @karamel 1657 Messages postés vendredi 9 mai 2008Date d'inscriptionModérateurStatut 18 juin 2018 Dernière intervention
- 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

@karamel 1657 Messages postés vendredi 9 mai 2008Date d'inscriptionModérateurStatut 18 juin 2018 Dernière intervention - 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.