如何在HTML画布上绘制三角图案？

Question

我正在尝试绘制从黑色到红色的线条图形模式，具体取决于波形的Y值。为了确定我是否正确地采用这种方法，我在JSFiddle开始了一个测试：

Test

var j,k; 
k=255;

var green=150;
var blue=150;

var canvas=document.getElementById('canvas');
var ctx=canvas.getContext('2d');

for(j=0;j<k;j++)
            {

              ctx.beginPath();
              ctx.moveTo(j, 0);
              ctx.lineTo(j, 150);
              ctx.strokeStyle = "rgb("&j&", 0, 0)";
              ctx.stroke();  


            }

但结果只是在所有线条中都是灰色调，尽管绘图方法在循环内部且“红色”值正在变化。

Answer 1

将@ Juhana的好建议付诸实践：

var j,k;
k=255;

var green=150;
var blue=150;

var canvas=document.getElementById('canvas');
var ctx=canvas.getContext('2d');

for(j=0;j<k;j++){
    ctx.beginPath();
    ctx.moveTo(j, 0);
    ctx.lineTo(j, 150);
    ctx.strokeStyle = "rgb("+j+",0,0)";
    ctx.stroke();     
}