Javascript 如何在p5.js中轻松创建椭圆？

我在p5.js中做了一个小的交互，当按下鼠标时，一个椭圆会移动，当松开鼠标时，椭圆会向下移动到起始位置

代码如下：

var easing = 0.01;
var start =  290;
var x = 0;
var y = 190;

function setup() {
  createCanvas(400, 200);
}

function draw() {
  background(220);

if (mouseIsPressed) {
  
ellipse (mouseX, mouseY, 20, 20);
  } else {
    var targetX = mouseX;
    x += (mouseX - x) * easing;
    ellipse(start, y, 20, 20);
  }
}

---

这应该能奏效

var=0.01；
var-startX=290；
var-startY=190；
var x=0；
var y=0；
函数设置（）{
createCanvas（400200）；
x=startX；
y=星形；
}
函数绘图（）{
背景（220）；
如果（按下鼠标）{
x=鼠标；
y=老鼠；
}否则{
x+=（startX-x）*；
y+=（起始-y）*缓和；
}
椭圆（x，y，20，20）；
}

html，正文{
保证金：0；
填充：0；
}
帆布{
显示：块；
}

请阅读-总结是，这不是向志愿者讲话的理想方式，可能会对获得答案产生反作用。请不要将此添加到您的问题中。是否有任何方法可以将椭圆保持在画布的范围内？谢谢你的帮助！在绘制椭圆之前，检查x和y是否位于相机旁边。如果是，请将该值设置为最大值