How to pan audio in iOS' Web Audio implementation?

问题

The WebAudio spec gives API calls for both two-channel L/R panning (StereoPannerNode) and panning in 3D space (PannerNode). Despite this, I can't find an approach that works on iOS.

Regarding normal L/R panning, MDN says that the 2D audioContext.createStereoPanner() is not implemented in iOS. (Or on desktop Safari.) Maybe you could create one by directly calling the PannerNode constructor, but I'm doubtful that works, at least on iOS.

AudioContext panning audio of playing media shows a way to do L/R panning without StereoPannerNode, using channel mergers and channel splitters. However, MDN says that createChannelMerger isn't implemented on iOS. Maybe you could directly calling the ChannelMergeNode constructor, but I'm also doubtful that this would work, at least on iOS.

As for panning in 3D, MDN says iOS doesn't support audioContext.createPanner. (Whereas desktop Safari does.) Again, maybe you could use the PannerNode constructor directly, but I'm doubtful. So I don't think 3D panning will work either.

回答1:

The StereoPannerNode isn't available yet, but the 3D PannerNode should work fine (not as constructor yet, but with the .createPanner() method). For example this is how you could achieve stereo panning with the 3D panner on iOS:

var pan = -1;  // This should be in range [-1, 1]

if (context.createStereoPanner) {
    var panner = context.createStereoPanner();
    panner.pan.value = pan;
} else {
    var panner = context.createPanner();
    panner.panningModel = 'equalpower';
    panner.setPosition(pan, 0, 1 - Math.abs(pan));
}

someSource.connect(panner);
panner.connect(context.destination);

I think that the MDN support tables aren't accurate or outdated a bit. Look in the PannerNode docs at MDN, the support table looks differently that the ones you've linked.

来源：https://stackoverflow.com/questions/52809552/how-to-pan-audio-in-ios-web-audio-implementation

标签

ios

web-audio-api