processing 学习1~5.docxVIP

processing 学习第一天笔记Processing?Month第一天?连接点?第一部分这篇文章中，我们来看一下如何计算一个圆周上的点的坐标，并将他们连接起来。我们将用灵活的方式来实现基于6个点和18个点的图像计算要计算这些点的坐标，必须知道圆上的点数量和圆的半径。本例中，我们将画12个点。int?numPoint?=?12;float?radius?=?150;下一步，我们来算一下每个点之间的角度。众所周知一个整圆的角度是360度或2π弧度，所以用360度除以圆上的点数，就得到两点之间的角度。例子中使用了弧度而不是角度，是因为?cos()?和?sin()?函数的形参是弧度数，不是角度数。Processing中有一些关于圆和半圆的常量，?TWO_PI?就代表了常量PI*2。（这里的PVector其实是类型，代表这一个点）float???angle?=?TWO_PI?/?numPoint;for(int?i=0?;?inumberPoints;i++){?float?x?=?cos(angle?*?i?)?*?radius;?float?y?=?sin(angle?*?i?)?*?radius;?point[i]?=?new?PVector(x,y?);}我把计算的部分放在了setup()里面，把结果存在了PVector数组里，这样我们就不用在draw函数里一遍又一遍的计算点的x、y坐标。我还用了一个for循环，用来计算每个点的坐标，**angle*i**?会在每个循环中计算出一个点的坐标。绘制接下来我们说一下，如何将圆上的点两两连线，我们需要用一个嵌套for循环，来遍历数组中的每一个点。if语句用来比较i和j的数字，如果他们不相等，电脑就在这两个点之间画一条线。如果i和j相等，说明是同一个点，那么就不用画线了。for?(int?i?=?0;?i??numPoints;?i++)?{?for?(int?j?=?0;?j??numPoints;?j++)?{?if?(?j?!=?i?)?{?line(?pointsi.x,?pointsi.y,points[j].x,points[j].y?);?}?}}源码：折叠Java 代码复制内容到剪贴板int?numPoints?=?10;???PVector[]?points?=?new?PVector[numPoints];???float?radius?=150;??void??setup()??{???size(450,400);????float?angle?=?TWO_PI/numPoints;???for(int?i=0;inumPoints;i++)???{???float?x?=?cos(angle?*?i?)?*?radius;???float?y?=?sin(angle?*?i?)?*?radius;???points[i]?=?new?PVector(x,y);???}???noLoop();??}???void?draw()??{???smooth();????PImage?img;??img?=?loadImage(images/laDefense.jpg);??background(img);???//??background(0);?//background(0,0,255);????//fill(0,0,255);???//?fill(255,102,255);???stroke(0,0,255,60);???translate(width/2,height/2);???for(int?i=0;inumPoints;i++){???for(int?j=0;jnumPoints;j++)???{???if(j!=i)?{???//??line(?pointsi.x,?pointsi.y,points[j].x,points[j].y?);???line(?points[i].x,?points[i].y,points[j].x,points[j].y?);?}???}???}??saveFrame(images/circle-connection-+numPoints+.png);??}??成果：processing 学习第二天笔记第二天?连接点第二部分今天的例子和昨天的类似，只不过我们将使用随机点代替固定点，连接点的时候也将采用不同的方式。如果两点之间的距离小于某一个我们定义的数，我们就把这两个点连接起来。并且将连线的透明度与两点距离相关联，距离越大，连线就越透明。我们用?dist()函数来计算两个点之间的距离。前两个参数是第一个点的x坐标和y坐标。第三，第四个参数是另外一个点的x坐标和y坐标。返回值为一个float类型的数值，代表两点之间的距离。如果