尝试在画布上创建随机像素时了解非随机输出

时间:2014-03-08 22:34:45

标签: javascript canvas random processing.js

我正在使用processing.js。对于draw()中循环的每次迭代,我在画布上的任何地方定义一个随机中心点(x,y),然后在80和100之间定义一个随机宽度和高度。这定义了一个矩形。然后我遍历矩形内的每个点并确定是否绘制一个点。绘制点的概率取决于它与中心的距离。我现在试图理解为什么我经常看到从矩形的左上角到右下角的填充条纹。

this

enter image description here

这是我的代码。

void setup() {
    size(500, 500); // size of canvas
    background(0); // black background
    noLoop();
}

void draw() {

    // clusters

    int x;
    int y; // center coordinates of clusters
    int halfWidth; 
    int halfHeight; // halves of width and height of clusters

    for (int i = 0; i < 3; i++) {
        x = int(random(500));
        y = int(random(500));
        halfWidth = int(random(40, 50));
        halfHeight = int(random(40, 50));
        for (int j = x - halfWidth; j < x + halfWidth; j++) {
            for (int k = y - halfHeight; k < y + halfHeight; k++) {
                if (int(random(1, dist(x, j, y, k))) == 1) {
                    stroke(color(int(random(0, 255)), int(random(0, 255)), int(random(0, 255))));
                    point(j, k);
                }
            }
        }   
    }   
}

1 个答案:

答案 0 :(得分:2)

这太傻了。 dist()接受dist(x1,y1,x2,y2),我有dist(x1,x2,y1,y2)。