Кривая Коха (HTML5 Canvas)

Процесс построения кривой Коха выглядит следующим образом: берём единичный отрезок, разделяем на три равные части и заменяем средний интервал равносторонним треугольником без этого сегмента. В результате образуется ломанная, состоящая из четырёх звеньев длины 1/3.
На следующем шаге повторяем операцию для каждого из четырёх получившихся звеньев. Предельная кривая и есть кривой Коха.

Обновите браузер

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

    var imgData = ctx.createImageData(canvas.width, canvas.width);

    function index(y, x, c) {
        var w = canvas.width;
        return (y * w + x) * 4 + (c || 0);
    }

    function draw(w, h, sx, sy) {
        var i;
        var j;
        var t;
        var mx = 0;
        var my = 0;
        var r = 500;

        var x;
        var y;

        for (i = 0; i < 50000; i++) {
            t = mx;
            if (Math.random() <= 1/2) {
                mx = 1/2 * mx + 1/(2*Math.sqrt(3)) * my;
                my = 1/(2*Math.sqrt(3)) * t - 1/2 * my;
            } else {
                mx = 1/2 * mx -1/(2*Math.sqrt(3)) * my + 1/2;
                my = -1/(2*Math.sqrt(3)) * t - 1/2 * my + 1/(2*Math.sqrt(3));
            }

            x = sx + Math.round(r * mx);
            y = sy - Math.round(r * my);

            imgData.data[index(y, x, 0 )] = 255;
            imgData.data[index(y, x, 3 )] = 255;
        }


        ctx.putImageData(imgData, x, y);
    }

    draw(canvas.width, canvas.width, 0, 150);