En ese caso, también tienes que cambiar $('#v1sign') por $('#v2sign'), $('#v3sign') etc, para cada uno de los 3 scripts.
Aunque, en lugar de cargar 3 scripts distintos para cada canvas, es mucho mejor tener un único script que defina una función y pasarle un parámetro con el ID del canvas que quieres inicializar. El código sería algo así:
Código Javascript
:
Ver originalfunction iniciarCanvas(id_canvas){
var mousePressedvj = false;
var lastXvj, lastYvj;
var vj;
function InitThisvj() {
vj = document.getElementById(id_canvas).getContext("2d");
var canvas = $('#' + id_canvas);
canvas.mousedown(function (e) {
mousePressedvj = true;
Draw(e.pageX - $(this).offset().left, e.pageY - $(this).offset().top, false);
});
canvas.mousemove(function (e) {
if (mousePressedvj) {
Draw(e.pageX - $(this).offset().left, e.pageY - $(this).offset().top, true);
}
});
canvas.mouseup(function (e) {
mousePressedvj = false;
});
canvas.mouseleave(function (e) {
mousePressedvj = false;
});
}
function Draw(x, y, isDown) {
if (isDown) {
vj.beginPath();
vj.strokeStyle = "blue";
vj.lineWidth = "3";
vj.lineJoin = "round";
vj.moveTo(lastXvj, lastYvj);
vj.lineTo(x, y);
vj.closePath();
vj.stroke();
}
lastXvj = x; lastYvj = y;
}
function clearArea() {
vj.setTransform(1, 0, 0, 1, 0, 0);
vj.clearRect(0, 0, vj.canvas.width, vj.canvas.height);
}
InitThisvj();
}
Y lo deberías inicializar así:
Código HTML:
Ver original<script language="javascript"> function startsign(){
iniciarCanvas("v1sign");
iniciarCanvas("v2sign");
iniciarCanvas("v3sign");
}
<body onload="startsign()">
Así solo tendrías que cargar el script una vez.
