let freqs = [];

let mic, spectrum;

let freqMap;

let a = 0;

​

function setup() {

  createCanvas(innerWidth, 400, WEBGL);

  colorMode(HSB);

  angleMode(DEGREES);

​

  mic = new p5.AudioIn();

  mic.start();

  fft = new p5.FFT();

  fft.setInput(mic);

​

  setInterval(addFreq, 800);

}

​

function draw() {

  background(0);

  translate(0, 100, -200);

  rotateX(90);

  rotateZ(a);

  a += 0.5;

​

  spectrum = fft.analyze();

​

  for (let f of freqs) {

    f.show();

​

    if (freqs.length > 5) {

      freqs.splice(0, 1);

    }

  }

}

​

function addFreq() {

  f = new Freq();

  freqs.push(f);

}

​

class Freq {

  constructor() {

    this.angle = 360;

    this.total = 100;

    this.r = this.total;

    this.n = [];

​

    for (let i = 0; i < spectrum.length; i++) {

​

      this.n.push(spectrum[i]);

    }

  }

​

  show() {

    noFill();

    strokeWeight(2);

    beginShape();

    for (let i = 0; i < this.angle; i ++) {

      let radius = map(this.n[i], 0, 255, 150, 0);

        let r = this.total;

        let x = this.r * cos(i);

        let y = this.r * sin(i);

        let z = r * sin(this.n[i]);

        stroke(radius, 100, 100);

        vertex(x, y, z);

​

        this.r += 0.005;

      }

      endShape(CLOSE);

    }

}

​