Skip to content

toakleaf/spectrogramJS

Repository files navigation

Spectrograph Screen Shot

I had a free day, so I thought I'd mess around with the Web Audio API a bit. I've always wanted to create a really large displayed spectrograph app with easy controls for zooming in/out on specific frequency bands and controlling latency. It's also capable of flipping between linear and logarithmic plotting, which is kinda a neat feature.

Not a bad day's work for my first at bat with this API.

I am hoping to use this API for visual reference while I'm experimenting with the various pitch detection algorithms I'm developing for my next adventure.

TODO:

  1. Maybe fix the toolbar styling to be a bit more mobile friendly.

  2. Add a image download feature?

Getting Started

  1. Clone the repo:

  2. Install dependencies:

    npm install
    
  3. Run webpack:

    npm start
    

Should open up automatically at http://localhost:3000

Instructions not included

  1. Hit the spacebar or 'k' key to pause

About

HTML5 Canvas and Web Audio API based spectrograph app. Live demo @ https://spectrogramjs.netlify.com

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published