# 3D audio spectrum without canvas code

**URL:** <https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841>\
**Category:** Showcase\
**Created:** [September 23, 2022, 5:47am UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841 "2022-09-23T05:47:02Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![jrlazz](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jrlazz/32/64383_2.png) [@jrlazz](https://discourse.threejs.org/u/jrlazz)\
**Post date:** [September 23, 2022, 5:47am UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841/1 "2022-09-23T05:47:02Z")

</div>

Hi Three.js followers,

3D audio spectrum without canvas code

recent link:

> **[audio3d\_Ff\_Ch\_r1.html](https://jrlazz.github.io/anim/audio3d_Ff_Ch_r1.html)**

old links:

> **[audio3d\_chrome\_r1.html](https://jrlazz.github.io/anim/audio3d_chrome_r1.html)**

> **[audio3d\_r1.html](https://jrlazz.github.io/anim/audio3d_r1.html)**

Again, Thanks for the great Three.js Team!

José Roberto Lazzareschi

 ![audio3d](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/6/c/6c2d0842a970f73ac065bd24fb57f6ca5c075665.jpeg)

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [September 23, 2022, 5:59am UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841/2 "2022-09-23T05:59:09Z")

</div>

Cool 🙂  
And nice set of music tracks 🤘

---

<div class="post-metadata">

**Author:** ![Usnul](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/usnul/32/2355_2.png) [@Usnul](https://discourse.threejs.org/u/Usnul)\
**Post date:** [September 23, 2022, 11:54am UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841/3 "2022-09-23T11:54:39Z")

</div>

doesn’t work for me

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/4/8/487b09fda248942c495f75db8356197dd4743d3e.png)

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [September 23, 2022, 12:14pm UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841/4 "2022-09-23T12:14:32Z")

</div>

Worked for me in Firefox. 🤔

---

<div class="post-metadata">

**Author:** ![anidivr](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/anidivr/32/32924_2.png) [@anidivr](https://discourse.threejs.org/u/anidivr)\
**Post date:** [September 23, 2022, 2:15pm UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841/5 "2022-09-23T14:15:26Z")

</div>

Using latest stable Edge 105.0.1343.42 I get the warning in browser console “The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page.”

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/b/8/b847255e601265650e3db0bee93617fccb2debf9.png)

Same warning in latest Edge developer build 107.0.1387.2 too.

Shouldn’t it be `var audioContext = new window.AudioContext()`?

Hope this helps

---

<div class="post-metadata">

**Author:** ![jrlazz](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jrlazz/32/64383_2.png) [@jrlazz](https://discourse.threejs.org/u/jrlazz)\
**Post date:** [September 23, 2022, 2:28pm UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841/6 "2022-09-23T14:28:55Z")

</div>

Hi Friends, I will be out for some days… and hope to test suggestions,  
making variations of the page for You to test.  
The alert “An AudioContext was prevented from starting automatically. It must be created or resumed after a user gesture on the page.” appears in Firefox too.  
Thank You for the attention and likes. 🙂

PS: In my Chrome it did not run.The console logged “audio3d\_r1.html:128 The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page. [Autoplay policy in Chrome - Chrome Developers](https://goo.gl/7K7WLu)”. Versão 78.0.3904.97 (Versão oficial) 64 bits Portable.

---

<div class="post-metadata">

**Author:** ![jrlazz](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jrlazz/32/64383_2.png) [@jrlazz](https://discourse.threejs.org/u/jrlazz)\
**Post date:** [September 23, 2022, 2:40pm UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841/7 "2022-09-23T14:40:21Z")

</div>

“Unstress You” was made in 2000/1 after a small heart attack.  
Thank You for … nice tracks 🙂

---

<div class="post-metadata">

**Author:** ![anidivr](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/anidivr/32/32924_2.png) [@anidivr](https://discourse.threejs.org/u/anidivr)\
**Post date:** [September 24, 2022, 12:35pm UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841/10 "2022-09-24T12:35:39Z")

</div>

Works great now 😃 👍

---

<div class="post-metadata">

**Author:** ![Usnul](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/usnul/32/2355_2.png) [@Usnul](https://discourse.threejs.org/u/Usnul)\
**Post date:** [September 24, 2022, 6:59pm UTC](https://discourse.threejs.org/t/3d-audio-spectrum-without-canvas-code/42841/11 "2022-09-24T18:59:49Z")

</div>

Can confirm that it works for me as well 👍