Colorful Circles - OpenProcessing

mySketch
xxxxxxxxxx
 
let MIN = 100;
let MAX = 550;
let FPS =120;
​
function setup() {
  colorMode(HSB);
  createCanvas(windowWidth, windowHeight);
  frameRate(FPS);
  background(0);
}
​
function draw() {
  push();
  fill(0, 0, 0, 0.1);
  rect(0,0,width,height);
  
  translate(width/2, height/2);
  noFill();
  strokeWeight(20);
  for(let i = MIN; i < MAX; i+=50){
    let c = map(i, MIN, MAX, 0, 255);
    stroke(1.5 * c, 255, 255);
    let rot = frameCount/FPS * i/280;  //Adjust the speed,the larger the number,the slower it is.
    (i%2==0) ? rotate(rot) : rotate(-rot);
    if(i > MIN){
      rot = map((sin(frameCount/FPS) * 0.01 * i), -2, 2, -HALF_PI, HALF_PI);
      
    }
    
    if (i === 300) { // 第5圈，i 从 100 开始，所以这里是 200
    stroke(255, 125, 255); // 白色
    } else if (i === 200) { // 第3圈，i 从 100 开始，所以这里是 300
    stroke(60, 255, 255); // 黄色
    } else if (i === 450) { // 第8圈，i 从 100 开始，所以这里是 300
    stroke(50, 100, 255); // 黄色
    } else {
    stroke(c, 255, 255); // 其他圈使用动态颜色
    }
    
    arc(0, 0, i, i, HALF_PI, -HALF_PI);
  }
  pop();
}