Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Web Audio API: Setting playbackRate Correctly

DZone's Guide to

Web Audio API: Setting playbackRate Correctly

· Web Dev Zone
Free Resource

Tips, tricks and tools for creating your own data-driven app, brought to you in partnership with Qlik.

I was working on a little demo showing the manipulation of playback rates of audio clips.  The Audio tag failed miserably.  On Safari and Chrome (both for Mac) the audio tag couldn't playback the audio any slower than half speed.

For what I was working on, this meant trying out the Web Audio API.  I stole some code that allowed for playback, got it working, then tried to manipulate the playbackRate for the clip. But no joy, no Chipmunks singing for me.

I looked up a couple of things, and many of them pointed at this statement from the HTML5Rocks Web Audio API FAQ:

Q: HOW CAN I CHANGE THE PITCH OF A SOUND USING THE WEB AUDIO API?
A: Change the playbackRate on the source node.


I tried and I tried for an hour to get this to work using this syntax:

source.playbackRate = 2.0;

Turns out you have to set it as:

source.playbackRate.value = 2.0;

Hopefully, this spares you some time.

 

Source: http://www.terrenceryan.com/blog/post.cfm/web-audio-api-setting-playbackrate

Explore data-driven apps with less coding and query writing, brought to you in partnership with Qlik.

Topics:

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}