Drawing a shape around a central point

MFDork

Hello all!

I'm currently trying to create a visualization for music using the p5.js example code for analyzing a frequency spectrum. The issue I'm running into is that I'd like to "bend" the frequency spectrum around a point in the center of my canvas, such that instead of a jagged line I instead have a jagged circle. I'm not quite sure where to begin to broach that subject. Here's what I have so far:

var fft;
var amplitude;
var song;

function preload(){
  song = loadSound('../assets/PeopleWhoDied.mp3');
}

function setup() {

   var myCanvas = createCanvas(1000,500);
   myCanvas.parent('pleaseKillMeSketch');
   background(200);

   song.play();
   fft = new p5.FFT();
   fft.setInput(song);

   amplitude = new p5.Amplitude();
   amplitude.setInput(song);

}

function draw() {
  fill(200, 20);
  rect(0,0,width,height);
   var spectrum = fft.analyze();
   var volume = amplitude.getLevel();

   beginShape();
   for (i = 0; i<spectrum.length; i++) {
     vertex(i, map(spectrum[i], 0, 255, 250, 0) );
     translate(0,volume);
   }
   endShape();
}

TfGuy44

float[] values = new float[360];

void setup(){
  size(400,400);
  for(int i=0;i<values.length;i++){
    values[i] = random(-1,1);//map(i,0,360,-1,1);
  }
}

void draw(){
  background(0);
  translate(width/2,height/2);
  stroke(255);
  for(int i=0;i<values.length;i++){
    point(cos(radians(i))*(160+20*values[i]),sin(radians(i))*(160+20*values[i]));
  }
}

MFDork

TFGuy44, you're a scholar and a gentleman. Thank You!