//

// By Jon Froehlich

// http://makeabilitylab.io/

​

let mic;

let xCircle;

let yCircle; 

let maxDiameter = 400;

​

function setup() {

  createCanvas(400, 400);

  // see https://p5js.org/reference/#/p5.AudioIn

  mic = new p5.AudioIn(); 

  mic.start();

  // Set x,y of circle in middle of canvas

  xCircle = width / 2;

  yCircle = height / 2;

  // Set default draw properties

  fill(200, 0, 0);

  noStroke();

}

​

function draw() {

  //background(220, 220, 220, 10);

  background(200);

  // get current microphone level

  let micLevel = mic.getLevel(); // between 0 and 1

  // the size of the circle proportional to mic level

  // The min and max of micLevel is 0 - 1. Map this to

  // the diameter values of 5 to maxDiameter

  // 

  let diameter = map(micLevel, 0, 1, 5, maxDiameter);

  circle(xCircle, yCircle, diameter);

}