Git Product home page Git Product logo

oscilloscope.js's Introduction

oscilloscope.js

A small javascript plugin to create an oscilloscope of an audio-context. You can see an example here

Install

bower install oscilloscope.js

Basic setup

// Create an audio-context
var audioContext = new window.AudioContext(),
    oscillator = audioContext.createOscillator();
    oscillator.type = 'sine';
    oscillator.frequency.value = 400;
    oscillator.start();

// Create an Oscilloscope instance
//   Parameters:
//     - The container in which the oschilloscope gets created
//     - an optional audio-context on which the oscilloscope creates an analyser-node,
//          and can connect to the destination.
//          If no audio-context is specified, a new one will be created created.
var oscilloscope = new Oscilloscope('.js-oscilloscope', audioContext);

// Connect the oscillator-node to the oscilloscope
oscillator.connect(oscilloscope.analyserNode);

// Start the oscilloscope
oscilloscope.start();

API

Properties

Oscilloscope.target // Container

Oscilloscope.width // The oscilloscope' width

Oscilloscope.height // The oscilloscope' height

Oscilloscope.svg // The svg-element in which we draw the oscilloscope

Oscilloscope.wave // The path svg-element which represents the audio wave

Oscilloscope.audioContext // The oscilloscope' audio-context

Oscilloscope.running // Indicates if the oscilloscope is running

Oscilloscope.hasAudio // Indicates if the oscilloscope is connected to the audio-context' destination

Methods

/**
 * Start the oscilloscope
 */
Oscilloscope.start();

/**
 * Stop the oscilloscope
 */
Oscilloscope.stop();

/**
 * Connect the analyser-node to another audio-node
 * @param  {audioNode} node An audio-node to connect to
 */
Oscilloscope.connect(audioNode);

/**
 * Connect the analyser-node to the audio-context' destination
 */
Oscilloscope.toggleAudio();

License

Oscilloscope.js is licensed under the MIT license.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.