Examples / Algorithmic / Hubble-Hearing

Here we build a soundscape representing data captured by the Hubble Space Telescope.

The Source

This example is a port of NASA's open-source, Hearing Hubble app found here.

Since you can already run their example in your browser, you might be wondering, why port this to Hz? Here's why:

• it's a simple example of sonification and comes with several nice data sets.
• the Hz audio-engine supports arbitrary CLAP plugins and a simpler note-generation API and this opens the door to more powerful synthesis and effects possibilities than available in web-audio.
• it was fairly simple to rewire it into our audio engine, audio graph and image previewer and thereby unlock these capabilites for your own creations.

The application is a collection of code and data files depicted at right.

hubble.js is the main driver program described below.

app/App.js is the main application context loaded by hubble.js via our slightly unusual Require idiom. The system is driven by animation event callbacks. This triggers updates to the playback head, and triggers the soundscape changes.

app/ImageSynth.js implements the synthesis of image-based sound. It is based on a bank of oscillators with unique frequencies and amplitudes of stars found under the playhead.

app/StarSynth.js implements the synthesis of star-based sound. We employ FluidSynth to produce the sound. You can programatically or manually change the current voice.

hubble.js

This is the driver file for our app. Most of the action occurs elsewhere but the driver is responsible for loading, instantiating and initializing the app. Once the performance begins (via Hubble.Perform()) our job is just to periodically yield control to the system and check for cancelation requests.

const {App} = await Require("./app/app.js"); // load our Hubble app
const Hubble = new App();
const thisDir = path.dirname(this.GetFilePath());
const div = document.querySelector(".Content");
// select a random harmony (scale).
const harmonies = Hubble.GetHarmonies();
const harmony = harmonies[Math.floor(Math.random()*harmonies.length)];
console.log("Using scale: " + harmony);
const appConfig = {
    harmony: harmony,
    speed: .33,
    imagesynth: {_active: true, Gain: -1, osc: "Sine"},
    starsynth: {_active: true, gain: 4, prog0: 103, reverblevel: 1, roomsize: 1.2},
};
const dataset = "ngc1850-blue"; // this is the only dataset we include
div.innerHTML = `<h3>Loading ${dataset}</h3>`;
await Hubble.Init(thisDir, div, this/*fiberCtx*/, appConfig);
await Hubble.LoadDataset(dataset);
Hubble.ascene.VisualizeGraph();
console.log(`Performing ${dataset}`);
Hubble.Perform(); // happens via callbacks, ie: in the bgd.
let dur = Hubble.ascene.Seconds(.5);
while(!Hubble.isDone)
{
    await Hubble.ascene.Wait(dur);
    let msg = yield;
    if(msg == "_cancel_") // supports cancellation from AudioMonitor
    {
        console.log("Hubble cancelled.");
        Hubble.isDone = true;
    }
}
Aengine.Close();

Explore Further

• implement various playhead styles (radial, top-down, etc)
• add more interface to control harmonies, start/stop, note-ranges, select between color and grey datasets, etc.
• download more datasets as described in hubble/data/_readme.md.