Javascript 我使用for循环来绘制不同的曲线。但是我怎样才能把每一行都换成不同的颜色呢?

Javascript 我使用for循环来绘制不同的曲线。但是我怎样才能把每一行都换成不同的颜色呢?,javascript,colors,html5-canvas,curves,Javascript,Colors,Html5 Canvas,Curves,在我的绘图功能中,我绘制所有内容。我画白色矩形是因为你可以改变每条曲线的位置,否则你会看到所有的曲线。不仅仅是你的新职位 function draw() { var canvasWidth = canvas.width; var canvasHeight = canvas.height; ctx.fillStyle = "white"; ctx.fillRect(0, 0, canvasWidth, canvasHeight); for (var i

在我的绘图功能中,我绘制所有内容。我画白色矩形是因为你可以改变每条曲线的位置,否则你会看到所有的曲线。不仅仅是你的新职位

function draw() {
    var canvasWidth = canvas.width;
    var canvasHeight = canvas.height;

    ctx.fillStyle = "white";
    ctx.fillRect(0, 0, canvasWidth, canvasHeight); 

    for (var i = 0; i <= line.length; i++) {    

            // Directly under this line of text stands my color for the 
            // curves and that is what needs to be corrected I guess.
            ctx.strokeStyle = "rgb(200,200,200)";
            ctx.beginPath();
            ctx.moveTo(500, 150);
            ctx.bezierCurveTo(line[i], 300, line[i], 300, line[i], 400 + (i * 15));
            ctx.stroke();
            ctx.closePath();

        console.log[i];
    }
}
下面的函数从my html中获取my的值,以便绘制正确的曲线

function create(){
    console.log("change line");
    var form = document.getElementById("frm1");

    for(var i = 0; i < form.length; i++){
        line[i] = form[i].value;
    }

    console.log(line);
    draw();
}

您可以使用如下函数:

function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}
为R、G和B的每个值检索一个介于0和255之间的随机数,红色、绿色和蓝色。 所以我会把你的代码写成

red = getRandomInt(0,255);
green = getRandomInt(0,255);
blue = getRandomInt(0,255);
ctx.strokeStyle = "rgb("+red+","+green+","+blue+")";

希望有帮助

你需要特定的颜色还是可以使用随机的颜色?如果是随机的话possible@tibogoethals不客气。请关闭此案例中已解决的答案!