Monstercat Themed Audio Spectrum Visualizer

So you are doing the spectrum analysis in javascript and then getting it into game using httpservice?

1 Like

No. I export the data ahead of time and upload it with the place file.
I don’t really know how to do it, and it does record the data with the song and is about 512 KB per song.

Tiny bit of an update:

Also, here is a song list if you want Drumstep: Tristam - The Vine Tristam & Braken - Flight

Glitch Hop/110 BPM:
Astronaut - Rain (Stephen Walking Remix)
Pegboard Nerds - Try This
Pegboard Nerds & Tristam - Razor Sharp
Tristam - I Remember
Tirstam - Once Again
Tristam - Till It’s Over

Drum And Bass (DnB):
Tristam & Braken - Frame Of Mind

Electro:
Case & Point - All On Me
Pegboard Nerds - Bassline Kickin (Astronaut Remix)
Pegboard Nerds - We Are One (Droptek Remix)
Pegboard Nerds - Rocktronik
Tristam x Karma Fields - Build The Cities (Empire Of Sound)

Electronic Dance Music (EDM):
Grabbitz - Better With Time
Pegboard Nerds - New Style
Pegboard Nerds - Swamp Thing
Tut Tut Child - Power Fracture

Future Bass:
Pegboard Nerds - Emoji

Indie Dance:
Grabbitz - Float Away

Trance:
Mitchell Claxton - Wuxia

I may add more songs soon, just need to look for them and find them on Roblox.
1 Like

Ayy, want to make a club place with me using this tech?

I am going to be busy with my own projects for the next few months (I still have to go back to a build project I paused to do this).
However, the code for getting the sound data is open, so feel free to create a fork and follow the instructions to get it to work.

If I could extract a raw mp3 file from ROBLOX, would it theoretically be possible to perform the audio spectrum analysis in pure Lua?

Maybe? I don’t fully understand how on earth this works or how on earth I got it to work in the first place. :stuck_out_tongue:

Comic [img]//devforum-uploads.s3.dualstack.us-east-2.amazonaws.com/uploads/original/3X/8/f/8fa1957a469164f8f9379118f239dcba073956ad.jpg[/img]

I don’t see why not. I was going to do this just now because I’ve nothing to do while I wait for my Vive to ship. I guess I’ll also port it to VR once my Vive comes in.

I have no problem sharing all of what I make with you or other devs when and (more importantly) if I finish.

The only dependency in this case would be an external server to get the mp3 data.

If you guys can figure it out, go ahead. It is far outside my area of knowledge to do.

Its far out of my own too.
Can you tell if the code they wrote is actually parsing the mp3 files you’re inputting, or do you know what they are using to do so?

I doubt it, browsers should have support for a AundioAnalyzer class (or some name like that)

would be better to turn this into an obstacle course or shootem up bullet hell

1 Like

I’ve always wanted to make a bullet hell in roblox, just too lazy atm. The visualizer sounds pretty easy though.

I read over the code a little and it seems like it’s reading the raw mp3 files. I didn’t see it using any external libraries. I could be wrong though.

Edit: Nevermind I was wrong. Doesn’t mean it’s impossible though.

This is true except for Internet Explorer.
Here are the relevant scripts to analyzing data:
[url=https://github.com/FromLegoUniverse/vis.js/blob/gh-pages/js/vis.js]https://github.com/FromLegoUniverse/vis.js/blob/gh-pages/js/vis.js[/url]
[url=https://github.com/FromLegoUniverse/vis.js/blob/gh-pages/js/visual/spectrum.js]https://github.com/FromLegoUniverse/vis.js/blob/gh-pages/js/visual/spectrum.js[/url]
[url=https://github.com/FromLegoUniverse/vis.js/blob/gh-pages/js/analysis/spectrum_algorithms.js]https://github.com/FromLegoUniverse/vis.js/blob/gh-pages/js/analysis/spectrum_algorithms.js[/url]

REMINDER: I only edited the JavaScript code. Anything that doesn’t affect the actual gathering of data is not by me.

1 Like

Well, I was wondering why the refresh rate was off for the visualizer. It appears I made a math error with sampling in the GitHub code.
Anyone who created a fork should update spectrum.js… and now I have to re-do 21 songs. Not fun.
(Also, no clue if I will now be able to use it in my office now unless there isn’t as much as a frame rate loss from ~18 FPS vs 60 (or 30 if I change the math).

I did something similar with @starwars
Here :slight_smile:

1 Like

No synthwave, no love.

#:c

Ok, 60 FPS version is up.
If anyone is using the encoder thing, please take note it now runs at 30 hz instead of 60 hz, as 60 hz has a lot of frame drops on my Lenovo Y510P.

Version 3 is now done (and I hope that is the final version).

Changes:

  1. Album details are shown, as Monstercat does for EPs
  2. Adjusted the sizing of the bars and info
  3. Moved to Arial instead of Source Sans
  4. Album cover and artist logo now shown instead of just the monstercat logo
    https://www.youtube.com/watch?v=xLtfqrYrEtk

Also, yes, 1080p @ 60 FPS.

3 Likes