Chapter 8 of 9

Scopes

Native analyzers live in the graph via wax.scope. Events arrive from the plugin — not from DOM CustomEvents or DataTree.

Wrap outputs

function scoped(node) {
  return wax.scope({ name: "main", size: 512, channels: 1 }, node);
}
wax.render(scoped(outL), scoped(outR));

Listen on both delivery paths

window.WAX._internal.receiveWaxNativeEvent = function (name, payload) {
  if (name === "scope") handleScopePayload(payload);
};

addEventListener("message", (e) => {
  const d = e.data;
  if (d?.type === "WAX_NativeEvent" && d.name === "scope") {
    handleScopePayload(d.payload);
  }
});

Payload shape: { source: "<name>", data: [Float32Array, …] }. Match source to your scope name.

Wrong patterns

addEventListener("waxMeter") or regex on type || name.
WAXTreeDestination.on("meter") — scope is not DataTree.
Web AnalyserNode when you are in native-only mode (hybrid fallback is OK — see Browser preview).

Try it

Full page: Scope visualizer demo

Example code

Snippets from this lesson — combine in your Custom Page.

Loading…