Combine Mono Signals to Stereo with Tone.Merge

In web audio development using Tone.js, spatial positioning and channel routing are essential for creating dynamic soundscapes. This article explains how to use the Tone.Merge node to combine two independent mono audio signals into a single, cohesive stereo output. You will learn the basic concepts of channel merging, how to instantiate the node, and how to route left and right audio channels effectively using practical code examples.

Understanding the Tone.Merge Node

By default, many audio sources in Tone.js (such as basic oscillators or mono players) output a single mono channel. If you want to position different sounds strictly in the left and right speakers without using a panner node, you need a way to merge these separate paths.

The Tone.Merge node solves this by providing two mono inputs—one for the left channel and one for the right channel—and combining them into a single stereo output.

How to Connect Mono Signals to Tone.Merge

To combine two mono signals, you instantiate the Tone.Merge node and connect your audio sources directly to its .left and .right input properties.

Here is a step-by-step code example demonstrating this process:

// 1. Create two separate mono sources (e.g., two oscillators)
const leftOscillator = new Tone.Oscillator(440, "sine").start();
const rightOscillator = new Tone.Oscillator(445, "triangle").start(); // slightly different frequency for stereo width

// 2. Create the Merge node and connect its stereo output to the main output
const mergeNode = new Tone.Merge().toDestination();

// 3. Connect the mono sources to the respective left and right inputs of the Merge node
leftOscillator.connect(mergeNode.left);
rightOscillator.connect(mergeNode.right);

In this setup: * leftOscillator is routed exclusively to the left speaker. * rightOscillator is routed exclusively to the right speaker. * The output of mergeNode is a single stereo signal sent to your speakers (toDestination()).

Key Benefits of Using Tone.Merge