Surrounding 3d sound effects using howler.js or another library?

Question

I'm working on a project and I need to add 3d sounds effects, like the sound is continually moving around the listener effects. Is it possible to achieve that with howlerjs i see that with howler i'm able to play a sound from specific coordinates/orientation but how to achieve surrounding/ambisonics sounds ? Or another library in JavaScript to achieve that?

Thanks for your help.

Answer 1

Half a year late, but yeah that's entirely possible in howler.js, haven't used it myself but judging from the docs you can just update the position. there's some more libraries that do it that I've found, check here how 3dage does exactly what you want: https://codepen.io/naugtur/pen/QgmvOB?editors=1010

  var world = IIIdage.World({
    tickInterval: 200
  })

  var annoyingFly = IIIdage.Thing({
    is: ['fly'],
    sounds: {
      'buzzing constantly': {
        sound: 'buzz',
        times: Infinity
      }
    },
    reacts: [
      {
        // to: world.random.veryOften(),
        to: world.time.once(),
        with: 'buzzing constantly'
      }
    ]
  })

// scene should create and expose a default world or accept one
  var scene = IIIdage.Scene({
    title: 'Annoying fly',
    library: {
      sounds: {
        'buzz': {
          src: ['https://webaudiogaming.github.io/3dage/fly.mp3']
        }
      }
    },
    world: world,
    things: [ // scene iterates all things and spawns them into the world. same can be done manually later on.
      annoyingFly({
        pos: [-1, -15, 0],
        dir: [1, 0, 0],
        v: 1
      })
    ]
  }).load().run()


  setTimeout(function () {
    scene.dev.trace(IIIdage.dev.preview.dom())
  }, 500)


  setInterval(function rotateVector() {
    var angleRad = 0.15
    var d=scene.things[0].attributes.dir
    var x=d[0], y=d[1]
    var cosAngle = Math.cos(angleRad), sinAngle = Math.sin(angleRad)

    scene.things[0].attributes.dir = [x * cosAngle - y * sinAngle,  y * cosAngle + x * sinAngle, 0]
  }, 500)

  window.scene = scene

There's still some others that do similar stuff:

• https://www.npmjs.com/package/songbird-audio
• https://www.npmjs.com/package/ambisonics

Hope this pushes you in the right direction if you still want help with it.