Странное случайное поведение Javascript

я использую функцию JavaScript Math.random()для распределения элементов по корзинам. После этого я отображаю ведра на холсте. Я ожидаю, что элементы будут распределены равномерно, но (даже после нескольких повторных попыток в нескольких браузерах) кажется, что распределение гораздо более мелкозернистое слева (ближе к нулю) и становится более однородным справа (ближе к 1). ). См. следующее изображение enter image description here.

Я делаю это неправильно, или случайная функция JavaScript — отстой? Ниже приведен код, который использовался для создания этого изображения:

<html>
    <head>
        <script>
            window.onload = function() {
                    var canvas = document.getElementById('canvas');
                    var ctx = canvas.getContext('2d');
                    var width = canvas.width;
                    var height = canvas.height;     
                    var buckets = width;
                    var total = width*height*0.3;
                    var bucketList = [];
                    // initialized each bucket to 0 items
                    for(var i=0; i<buckets; ++i) { 
                            bucketList[i] = 0;  
                    }
                    // distribute all items over the buckets
                    for(var i=0; i<total; ++i) {
                        ++bucketList[Math.floor(Math.random()*buckets)];
                    }
                    // draw the buckets
                    ctx.fillStyle = "rgb(200,0,0)";
                    for(var i=0; i<buckets; ++i) {
                        ctx.fillRect (i, height-bucketList[i], i+1, height);  
                    }
            }
            </script>
    </head>
    <body>
            <canvas id="canvas" width="1000px" height="500px"/>
    </body>
</html>
9
задан Mankarse 22 May 2012 в 10:45
поделиться