HTML5 Canvas 颜色帮助

Question

您好，我的变量中有一个简单的数组，其中包含一些颜色

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/池

Answer 1

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

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

这可能是由您在返回的颜色上加上单引号引起的 - 您不需要这样做是因为它已经是一个字符串值。您也从未真正从数组中提取值。将其用于您的 colors() 函数：

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

Answer 2

这应该可以解决您的问题

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

演示