Javascript 如何使用JS为画布中的每个对象获取随机颜色？

我想为画布中的每个对象获取随机颜色我如何才能做到这一点，我尝试了以下方法：

for (var i = 0; i < 100; i++) {
    var raza = (Math.random() - 0.001) * 30;
    var x = Math.random() * (innerWidth - raza * 2) + raza;
    var y = Math.random() * (innerHeight - raza * 2) + raza;
    var dx = (Math.random() - 0.5) * 4; //calcul viteza X
    var dy = (Math.random() - 0.5) * 4; //calcul viteza Y
    var color = c.strokeStyle = "#" + ((1 << 24) * Math.random() | 0).toString(12);
    cercArray.push(new Circle(x, y, dx, dy, raza, color));
}

for（变量i=0；i<100；i++）{
var raza=（Math.random（）-0.001）*30；
var x=Math.random（）*（innerWidth-raza*2）+raza；
var y=Math.random（）*（innerHeight-raza*2）+raza；
var dx=（Math.random（）-0.5）*4；//calcul viteza X
var dy=（Math.random（）-0.5）*4；//calcul viteza Y
var color=c.strokeStyle=“#”+（（1有很多不同的方法可以做到这一点，下面是一个使用HSL的示例


const canvas=document.querySelector（'canvas'）；
const ctx=canvas.getContext（'2d'）；
让lastDate=Date.now（）-500；
函数绘图（）{
请求动画帧（绘制）；
常量颜色={
h:Math.floor（Math.random（）*360），
s:Math.floor（Math.random（）*100），
v:Math.floor（Math.random（）*100）
};
如果（lastDate+500

目前，我生成的随机圆圈的大小和颜色都是随机的，但所有圆圈的颜色都是相同的，只会在页面刷新时改变。请尝试将颜色分配分隔成不同的行。例如c.strokeStyle=“#”+（..）；var color=c.strokeStyle；这没有什么帮助，但thanksA一个好主意是使用hsl颜色并随机设置色调：
hsl（${Math.random（）*360}，100%，50%）
。但是这有一个不方便的地方，那就是你会得到所有相同的饱和度和亮度。另一个想法是使用一个颜色数组，随机选择一种颜色
color=colors[~（Math.random（）*colors.length）]；
你也可以尝试使用rgb颜色
rgb（${Math.random（）*255}，${Math.random（）*255}，${Math.random（）*255}，${Math.random（）*255}）