Ширина холста заставляет браузер зависать - PullRequest
Новая
       16

Ширина холста заставляет браузер зависать

1 голос
/ 02 января 2012

Функция ниже используется для рисования на холсте: 

function draw(id)
    {
        var canvas=document.getElementById(id);
        if(canvas==null)
        return false;
        var context=canvas.getContext('2d');
        //colors
        var colors=["red","orange","yellow","green","blue","navy","purple","red","orange","yellow","green","blue","navy","purple","red","orange","yellow","green","blue","navy","purple"];
        //line width
        context.lineWidth=10;
        var time = new Date().valueOf();
        var j = 100;
        for(var i=0;i<colors.length;i++){
            if(id == 'canvas1') {
                //sperate set up
                context.translate(0,10);
                context.rotate(Math.PI / 18);
                context.scale(1.2, 1.3);
            }
            else {
                //set up within transform
                context.transform(Math.cos(Math.PI/18) * 1.2,
                    Math.sin(Math.PI/18) * 1.2,
                    -Math.sin(Math.PI/18) * 1.3,
                    Math.cos(Math.PI/18) * 1.3, 0, 10)
            }
            context.strokeStyle=colors[i];
            context.beginPath();
            context.arc(50,100,100,0,Math.PI,true);
            context.stroke();
            if(i == colors.length - 1 && j) {
                context.setTransform(1,0,0,1,10 * (100 - --j),0);
                i = -1;
            }
        }
        document.getElementById(id + '-btn').innerHTML = new Date().valueOf() - time;
    }

Я обнаружил, что если ширина холста равна 15000: 

<canvas id="canvas2" width="15000" height="800"></canvas>

Все в порядке.

Но если я установлю ширину холста 1500 

<canvas id="canvas2" width="1500" height="800"></canvas>

Это заставляет браузер зависать !!!!

Почему?

...