HTML5 Canvas颜色帮助

时间:2010-12-06 16:05:34

标签: javascript html5 canvas

嗨,我的变量中有一些简单的数组,有一些颜色

var clr = ['#FF0000', '#0000FF', '#FFFF00', '#008000', '#FFA500', '#800080', '#ffffff'];

然后是一个函数,它应该在单引号中返回其中一个值

function colors() {
    var color;
    color = "'";
    color += Math.floor(Math.random() * clr.length);
    color += "'";
    return color;
}

然后调用此函数以显示各种彩球

function CreateBall(x, y, vx, vy, r, s) {
    this.color = colors();
    this.x = x;
    this.y = y;
    this.vx = vx;
    this.vy = vy;
    this.r = r;
    this.size = s;
}

然而它不起作用?有什么想法吗?

要查看完整代码,请在此处查看来源:http://dev.driz.co.uk/pool

2 个答案:

答案 0 :(得分:4)

目前,colors()返回的值是一个类似于"'#ffffff'"的字符串。实际应用此颜色值时,将在以下行中引发语法错误:

  

122: gradient.addColorStop(.85, ball[i].color);

这很可能是由于您使用返回的颜色包裹的单引号引起的 - 您不需要这样做,因为它已经是字符串值。您也从未实际从数组中提取值。将此用于colors()功能:

function colors() 
{
    return cls[Math.floor(Math.random() * clr.length)];
}

答案 1 :(得分:2)

这应该可以解决您的问题

function colors() {
    return clr[Math.floor(Math.random() * clr.length)];
}

Demo