Bonjour,
Voila je rencontre un petit problème avec mon code.
je fais un canvas signature pour mon site et pour cela j'ai pris un code que je vous montre ci-dessous.
voici mon code ci dessous je voudrais pouvoir signer avec mais il m'affiche des erreurs comme "this.drawLine is not a function" et si je met bind il fais rien y a pas de signature voilà mon soucis est-ce que quelqu'un peut m'aider
class Sign {
constructor() {
// Variables :
this.color = "#000";
this.painting = false;
this.started = false;
this.width_brush = 1;
this.canvas = $("#sign");
this.cursorX, this.cursorY;
this.context = this.canvas[0].getContext('2d');
// Trait arrondi :
this.context.lineJoin = 'round';
this.context.lineCap = 'round';
this.mousedown();
this.mouseup();
this.mousemove();
this.drawLine();
}
mousedown() {
// Click souris enfoncé sur le canvas, je dessine :
$(this.canvas).mousedown(function (e) {
this.painting = true;
// Coordonnées de la souris :
this.cursorX = (e.pageX - this.offsetLeft);
this.cursorY = (e.pageY - this.offsetTop);
});
}
mouseup() {
// Relachement du Click sur tout le document, j'arrête de dessiner :
$(this.canvas).mouseup(function () {
this.painting = false;
this.started = false;
});
}
mousemove() {
// Mouvement de la souris sur le canvas :
$(this.canvas).mousemove(function (e) {
// Si je suis en train de dessiner (click souris enfoncé) :
if (this.painting) {
// Set Coordonnées de la souris :
this.cursorX = (e.pageX - this.offsetLeft) - 2; // 10 = décalage du curseur
this.cursorY = (e.pageY - this.offsetTop) - 2;
this.drawLine()
}
});
}
// Fonction qui dessine une ligne :
drawLine() {
// Si c'est le début, j'initialise
if (!this.started) {
// Je place mon curseur pour la première fois :
this.context.beginPath();
this.context.moveTo(this.cursorX, this.cursorY);
this.started = true;
}
// Sinon je dessine
else {
this.context.lineTo(this.cursorX, this.cursorY);
this.context.strokeStyle = this.color;
this.context.lineWidth = this.width_brush;
this.context.stroke();
}
}
}
je voudrais pouvoir signer avec mon canvas
pas de signature
this.drawline is not fonction ou rien