Помогите, чото я не пойму как работатет этот сраный canvas. надоеллся уже.
В двух словах: хочу картинку превратить в мозаику, разбить на квадраты залитые усредненным цветом. Причем одна мозаинка = 1 канвас.
У меня получается так, что рисуется куча прозрачных квадратов и только последний залит цветом.
Внутри покажу как я это делаю

Tagged with →  

4 Responses to Помогите, чото я не пойму как работатет этот сраный canvas.

  1. Mo0white:

    var size = 50;
    var rows = Math.ceil($(this).height() / size);
    var cols = Math.ceil($(this).width() / size);

    for (var r = 0; r < rows; r++)
    {
    for (var c = 0; c < cols; c++)
    {
    var canvas = document.createElement(‘canvas’);
    canvas.width = size;
    canvas.height = size;

    var ctx = canvas.getContext(‘2d’);
    ctx.drawImage(this, c*size, r*size, c*size+size, r*size+size);

    var imgData = ctx.getImageData(c*size, r*size, c*size+size, r*size+size).data;
    var mc = calcMidColor(imgData);

    ctx.clearRect( 0, 0, size, size);

    ctx.fillStyle = ‘rgba(‘ + mc[0] +’,’+ mc[1] +’,’+ mc[2] +’,’+ 255 + ‘)’;
    ctx.fillRect( c*size, r*size, c*size+size, r*size+size );

    $(this).after(canvas);
    }
    }

  2. AilNo:

    привет, замыкания! 🙂

  3. Mo0white:

    спасибо я прозрел 🙂

  4. AilNo:

    я если честно код не смотрел. И если угадал — то рад. Просто цикл + последнее значение в переменной — признак замыканий.

Добавить комментарий