Rotation / sound reactive / stopping drawing

i’m totally new to coding and p5 - i’ve been messing creating a visualiser from the intro tutorials and grabbing bits and pieces from different tuts.

Basically -

  1. is there away to rotate all the ellipses/objects on the canvas around a point (so it’s like the canvas has rotated)?
  2. is there a way for the ellipses to disappear after a set amount of time (10s for example)?

Thanks in advance <3

var song;

function setup() {
  // URL copied from the Glitch assets folder
  song = loadSound('');
 createCanvas(512, 512);

    // create a new Amplitude analyzer
  analyzer = new p5.Amplitude();

  // Patch the input to an volume analyzer

   fft = new p5.FFT(0.5,512);
   //smoothing, bins


function mousePressed() {
  if ( song.isPlaying() ) { // .isPlaying() returns a boolean
  } else {;

function draw() {
let rms = analyzer.getLevel();
//calls amp thing

var spectrum = fft.analyze();
for (var i = 0; i < spectrum.length; i++) 
  //calls fft thing
	var amp = spectrum[i];
	var y = map(amp, 0, 256, height, 0)
	fill(random(255), random(255), random(255),height); // colour of ellipse
	ellipse(y+10, random(i+1, i+300), 5 + rms * 150, 5 + rms * 150,); // ellipse

1 Like

Welcome to the forum!

To do this, you’ll want to make a separate PGraphic, do all your drawing on it, and then rotate/draw it every frame.

This one’s a little trickier. You’re going from “draw an ellipse” to “keep track of every ellipse I draw, keep track of how long it’s been a live, and do something once it reaches the end of its life” . You’re gonna want to start looking into classes and the concept of object-oriented programming.

If that sounds like a lot, don’t worry, they’re pretty intuitive ideas, and they’re programming concepts that you’ll run into again and again.

If you have any more questions, just ask! Happy coding

1 Like

awesome, thanks a bunch Tony :slight_smile: