audio-oscilloscope

Audio oscilloscope in canvas.

Usage no npm install needed!

<script type="module">
  import audioOscilloscope from 'https://cdn.skypack.dev/audio-oscilloscope';
</script>

README


logo


audio-oscilloscope

Audio oscilloscope in canvas.

License Build Status dependencies Status NPM version

NPM

Demo

https://lab.miguelmota.com/audio-oscilloscope

Install

npm install audio-oscilloscope

Usage

var oscilloscope = AudioOscilloscope(document.getElementById('canvas'), {
  canvas: {
    width: function() {
      return window.innerWidth;
    },
    height: 400
  },
  canvasContext: {
    lineWidth: 2,
    fillStyle: 'rgb(0,0,0)',
    strokeStyle: 'green'
  }
});

oscilloscope.draw();

navigator.mediaDevices.getUserMedia({
  audio: true
}).then(function(stream) {
  var audioContext = new AudioContext();
  var source = audioContext.createMediaStreamSource(stream);
  oscilloscope.addSource(source);
}).catch(function(error) {
  console.error(error);
});

License

MIT