JavaScript、p5.js プログラム このページの下の窓で動きます

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.2/p5.js"></script>
<script language="javascript" type="text/javascript">
function setup() {
  createCanvas(601, 601);
  stroke(100,0,0);// 線の色
  fill(200, 150, 150);// 円の色
 // fill(0, 0, 0);// 黒
}

function draw() {
  background(200);// 背景の白さ
  mouseDragged(x);

}

function mouseDragged(x) {
 var X=mouseX; var Y=mouseY;
  ellipse(X, Y , 200); // 線の太さ
var L=pow(pow(X-width/2,2)+pow(Y-height/2,2),0.5);
var angle=atan2(height/2-Y,X-width/2);
for (var i=1; i<4; i++) {
a=angle-PI/4*i*2;
 ellipse(width/2+L*cos(a),height/2-L*sin(a),200);
}
for (var i=0; i<4; i++) {
a=PI/2-angle+PI/4*i*2;
 ellipse(width/2+L*cos(a),height/2-L*sin(a),50);
}
}
</script>