第二天 連接點第二部分
今天的例子和昨天的類似,只不過我們將使用隨機點代替固定點,連接點的時候也將採用不同的方式。如果兩點之間的距離小於某一個我們定義的數,我們就把這兩個點連接起來。並且將連線的透明度與兩點距離相關聯,距離越大,連線就越透明。
我們用 dist()函數來計算兩個點之間的距離。前兩個參數是第一個點的x座標和y座標。第三,第四個參數是另外一個點的x座標和y座標。返回值爲一個float類型的數值,代表兩點之間的距離。如果距離小於255,我們就在這兩點之間連線。
float dst = dist( points<i>.x, points<i>.y, points[j].x,points[j].y ); if ( dst < 255 ) { stroke( 255, 255 - dst ); line( points<i>.x, points<i>.y, points[j].x, points[j].y ); }
畫完這些細線之後,我們稍微放大點的體量,這樣會讓圖像更好看。以下這些代碼將加入到第一個for-loop循環的結尾、內部循環之後。
stroke( 255 ); strokeWeight(4); point( points<i>.x, points<i>.y ); 源碼:
int numPoints = 10;
PVector [] points = new PVector[numPoints];void setup()
{
size(450,400);
for(int i=0;i<numPoints;i++)
{
points[i]=new PVector(random(width),random(height));
}
noLoop();
}void draw()
{
smooth();
background(0);
noFill();
for(int i=0;i<numPoints;i++){
for(int j=0;j<numPoints;j++)
{
strokeWeight(1);
if(j!=i) {
float dst = dist(points[i].x,points[j].y,points[j].x,points[j].y);
if(dst<255) {
stroke(255,255-dst);
line(points[i].x,points[i].y,points[j].x,points[j].y);
}
}
}
stroke(255);
strokeWeight(4);
point(points[i].x,points[i].y); //節點畫點
}
saveFrame("images/random-connections-"+numPoints+".png");
}
成果