# Sound display on a wall

**URL:** <https://discourse.processing.org/t/sound-display-on-a-wall/26044>\
**Category:** Libraries\
**Tags:** homework\
**Created:** [December 8, 2020, 11:14am UTC](https://discourse.processing.org/t/sound-display-on-a-wall/26044 "2020-12-08T11:14:52Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![slothzzz](https://avatars.discourse-cdn.com/v4/letter/s/ecae2f/32.png) [@slothzzz](https://discourse.processing.org/u/slothzzz)\
**Post date:** [December 8, 2020, 11:14am UTC](https://discourse.processing.org/t/sound-display-on-a-wall/26044/1 "2020-12-08T11:14:53Z")

</div>

hi guys i’m approaching with processing and i’m thinking about a project (to project the sound display on the wall in my bedroom)  
this is the idea

 ![111](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/9/923ea21cf1db91154dfcdb206ebb43917a9e401a.png)  
how can i do it?  
thanks

---

<div class="post-metadata">

**Author:** ![jay\_m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jay_m/32/11020_2.png) [@jay\_m](https://discourse.processing.org/u/jay_m)\
**Post date:** [December 9, 2020, 3:49pm UTC](https://discourse.processing.org/t/sound-display-on-a-wall/26044/2 "2020-12-09T15:49:24Z")

</div>

what does the graph represent (X axis? Y axis?)

---

<div class="post-metadata">

**Author:** ![slothzzz](https://avatars.discourse-cdn.com/v4/letter/s/ecae2f/32.png) [@slothzzz](https://discourse.processing.org/u/slothzzz)\
**Post date:** [December 9, 2020, 10:23pm UTC](https://discourse.processing.org/t/sound-display-on-a-wall/26044/3 "2020-12-09T22:23:49Z")

</div>

it’s a frequency spectrum, this is the example [https://p5js.org/examples/sound-frequency-spectrum.html](https://p5js.org/examples/sound-frequency-spectrum.html) but i don’t know how to modify it.

---

<div class="post-metadata">

**Author:** ![jay\_m](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jay_m/32/11020_2.png) [@jay\_m](https://discourse.processing.org/u/jay_m)\
**Post date:** [December 10, 2020, 10:56am UTC](https://discourse.processing.org/t/sound-display-on-a-wall/26044/4 "2020-12-10T10:56:12Z")

</div>

Do you understand the code you linked and what a [FFT](https://processing.org/reference/libraries/sound/FFT_analyze_.html) delivers?  
In the draw function you have a for loop` for (i = 0; i < spectrum.length; i++) {` going though the FFT bands, so look at some graphic examples, and for each band you just need to draw a number (depending on `spectrum[i]` of stacked [rectangles](https://processing.org/reference/rect_.html) and [filled with a given color](https://processing.org/reference/fill_.html) depending on the band (so may be have an array of colors too) against a specific [background color](https://processing.org/reference/background_.html)

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 10, 2020, 12:12pm UTC](https://discourse.processing.org/t/sound-display-on-a-wall/26044/5 "2020-12-10T12:12:20Z")

</div>

that’s not p5.js but processing

```auto

// source : http://code.compartmental.net/tools/minim/quickstart/

import ddf.minim.*;
import ddf.minim.analysis.*;

Minim minim;
AudioPlayer song;
FFT fft;

void setup() {
  size(1612, 700);

  // always start Minim first!
  minim = new Minim(this);

  frameRate(1000); 

  // specify 512 for the length of the sample buffers
  // the default buffer size is 1024
  song = minim.loadFile("groove.mp3", 512);
  song.play();

  // an FFT needs to know how
  // long the audio buffers it will be analyzing are
  // and also needs to know
  // the sample rate of the audio it is analyzing
  fft = new FFT(song.bufferSize(), song.sampleRate());
}

void draw() {
  background(0);
  // first perform a forward fft on one of song’s buffers
  // I’m using the mix buffer
  // but you can use any one you like
  fft.forward(song.mix);

  stroke(255, 0, 0, 128);
  // draw the spectrum as a series of vertical lines
  // I multiple the value of getBand by 9
  // so that we can see the lines better
  for (int i = 0; i < fft.specSize(); i++) { 
    rect(i*8, height - fft.getBand(i)*9, 
      8, fft.getBand(i)*9);
  }//for 

  // ------------------------------------
}
//

```
