You're not building the string correctly:
drawanim("rgb(" + rgb.join(",") + ")");
One way to tell is to note how the syntax detector on this site colors the code. In your case, it colored the entire expression as a single string.
Question
Maybe you can help me, i need to create an animation with jquery and canvas. So, i would like to change the color of my canvas element when mouse move, the color rgb must be random and change when the mousemove change.
This is my code (canvas + query) :
window.onload = function()
{
var canvas = document.getElementById('canvas'),
context = canvas.getContext('2d');
function drawanim(color){
context.fillStyle=color;
context.beginPath();
context.moveTo(106,20);
context.lineTo(130,67);
context.lineTo(182,74);
context.lineTo(144,111);
context.lineTo(153,163);
context.lineTo(106,139);
context.lineTo(60,163);
context.lineTo(69,111);
context.lineTo(31,74);
context.lineTo(83,67);
context.lineTo(106,20);
context.fill();
}
drawanim("color");
// SOURIS POSITION
var $canvas = $('#canvas'),
w = 0,h = 0,
rgb = [],
getWidth = function() {
w = $win.width();
h = $win.height();
};
$('#canvas').resize(getWidth).mousemove(function (e) {
rgb = [
Math.round(e.pageX/w * 255),
Math.round(e.pageY/h * 255),
150
];
drawanim("rgb('+rgb.join(',')+')");
});
La solution
You're not building the string correctly:
drawanim("rgb(" + rgb.join(",") + ")");
One way to tell is to note how the syntax detector on this site colors the code. In your case, it colored the entire expression as a single string.
Autres conseils
Assuming you want the RGB to be truly random:
rgb = [
0 | Math.random() * 256,
0 | Math.random() * 256,
0 | Math.random() * 256
];
drawanim("rgb(" + rgb.join(",") + ")");
Or, as your code poses, for it to respond to cursor position; what you have should work, you just need to correct the quotes here:
drawanim("rgb(" + rgb.join(",") + ")");