Javascript 分形起始图

获得计算机图形分配，使用webgl和仿射变换绘制分形

我不知道应该在drawFigure（）函数中绘制什么图形，或者我是否采取了正确的方法来解决这个问题

到目前为止，我都做到了：

var canvas=document.getElementById（“分形”）
，ctx=canvas.getContext（“2d”）
，深度=6
，HEIGHT=canvas.HEIGHT
，WIDTH=canvas.WIDTH；
功能图（彩色）{
ctx.beginPath（）；
ctx.fillStyle=颜色；
ctx.fillRect（宽*0.25，高*0.25，宽*0.5，高*0.5）；
ctx.fill（）；
}
函数drawFractal（深度、颜色、k）{
如果（深度==0）{
图形（颜色）；
返回；
}
k=k | | 1；
//西北
ctx.save（）；
变换（0.5,0,0,0.5,0,0）；
drawFractal（深度-1，颜色为“FF0000”，k*（-1））；
ctx.restore（）；
//东北
ctx.save（）；
变换（0.5,0,0,0.5，宽度/2,0）；
drawFractal（深度-1，颜色| |“#00FF00”，k）；
ctx.restore（）；
//西南
ctx.save（）；
变换（0.5,0,0,0.5,0，高度/2）；
drawFractal（深度-1，颜色| |“#0000FF”，k）；
ctx.restore（）；
//硒
ctx.save（）；
变换（-0.25*k，0，0，0.25*k，0.75*宽度，0.75*高度）；
drawFractal（深度-1，颜色| | |“#FF00FF”，k）；
ctx.restore（）；
}
深度
我自己设法弄明白了。我所需要做的就是在k<0时翻转图形。通过改变：

if (depth == 0) {
    drawFigure(color);
    return;
}

到

if（深度==0）{
if（k<0）{
平移（宽度、高度）；
ctx.刻度（-1，-1）；
}
图形（颜色）；
返回；
}

if (depth == 0) {
    if (k < 0) {
        ctx.translate(WIDTH, HEIGHT);
        ctx.scale(-1, -1);
    }
    drawFigure(color);
    return;
}