本站于2023年9月4日。收到“大连君*****咨询有限公司”通知
说我们IIS7站长博客，有一篇博文用了他们的图片。
要求我们给他们一张图片6000元。要不然法院告我们
为避免不必要的麻烦，IIS7站长博客，全站内容图片下架、并积极应诉
博文内容全部不再显示，请需要相关资讯的站长朋友到必应搜索。谢谢！
另祝：版权碰瓷诈骗团伙，早日弃暗投明。
相关新闻：借版权之名、行诈骗之实，周某因犯诈骗罪被判处有期徒刑十一年六个月
叹！百花齐放的时代,渐行渐远!
开始
- 创建画布，生成一个400*400大小的画布。
function setup() {
createCanvas(400, 400);
}
- 创建背景及小球，首先通过background()函数创建一个天蓝色（87，250,255）的背景，再创建一个20*20大小的小球，生成地点位于（200,200）的位置，使用ellipse（）函数创建，ellipse（）函数内有四个参数，分别表示生成小球的x,y坐标及宽和高。
var x=200,y=200;
function draw() {
background(87,250,255);
ellipse(x,y,20,20);
}
draw()函数会不断地运行（频率为FPS，默认60帧/秒）
- 让小球动起来，通过draw（）函数不断刷新屏幕可以通过改变小球的x,y坐标让小球运动起来。
var sx=2,sy=3;
function draw() {
background(87,250,255);
ellipse(x,y,25,20);
x+=sx;
y+=sy;
}
- 让小球来回运动，通过条件判断让小球来回运动，如果小球来到了边缘位置，就让小球的x/y坐标减1
if(x>width||x<0){
sx*=-1;
}
if(y>height||y<0){
sy*=-1;
}
最后附上完整代码：
var x=200,y=200;
var sx=2,sy=3;
function setup() {
createCanvas(400, 400);
}
function draw() {
background(87,250,255);
ellipse(x,y,20,20);
x+=sx;
y+=sy;
if(x>width||x<0){
sx*=-1;
}
if(y>height||y<0){
sy*=-1;
}
}
如果想进一步探讨p5.js，可以关注我的vx公众号：大李日志
