hvianna / audiomotion.js Goto Github PK

Hello there,

First of all, I want to mention how awesome this library is. I've been visualizing input with FFT with p5.js for a while, but got sick of how much code was needed. This looks way better and works better too.
I'm currently working on using this library to create a visualizer in an electron app, which is also using Angular.
This means I really need to change some stuff around. Everything seems to work really well so far, but I can't get the reflection to work.

Im passing the following properties to the audioMotion object:

options = {
        // audioCtx: undefined,
        barSpace: 0.1,
        bgAlpha: 0.7,
        fftSize: 8192,
        fillAlpha: 1,
        gradient: 'classic',
        lineWidth: 0,
        loRes: false,
        lumiBars: false,
        maxDecibels: -25,
        maxFreq: 22000,
        minDecibels: -85,
        minFreq: 20,
        mode: 2,
        onCanvasDraw: this.drawCallback.bind(this),
        overlay: false,
        radial: false,
        reflexAlpha: 0.15,
        reflexBright: 1,
        reflexFit: true,
        reflexRatio: 0,
        showBgColor: true,
        showFPS: false,
        showLeds: false,
        showPeaks: true,
        showScale: false,
        showScaleY: false,
        smoothing: 0.7,
        spinSpeed: 0,
        start: true,
    }

When I change reflexRatio from 0, as shown here, to anything else, like 0.1, I get an error when the canvas is drawing.
The error I get is:

ERROR TypeError: Failed to execute 'setTransform' on 'CanvasRenderingContext2D': 6 arguments required, but only 0 present.
    at AudioMotionAnalyzer._draw (audioMotion-analyzer.js:910)
    at audioMotion-analyzer.js:501
    at ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:28183)
    at ZoneDelegate.invokeTask (zone.js:420)
    at Zone.runTask (zone.js:188)
    at ZoneTask.invokeTask (zone.js:503)
    at ZoneTask.invoke (zone.js:492)
    at timer (zone.js:3034)

Am I doing something wrong or is using reflection in electron/angular not possible?

Well now that I have the Folder search sorted, and things seems to work - but then I found out, that the images, background and front does not seem to appear in the Visualizer... Seems like everything else is working. But am I missing something, the images? Or does it need to have access to something or what?....

Darkijah

Kinda hard to just take an image and see.... As it is kinda of a flow video thing in action.
I think it is with all browsers, and probably able to reproduce it with a lower resolution where the player don't exactly fit.
Although even if it does not fit exactly do my screen I usually get around it with the scrollbar that now disappears in the new version and then comes up doing some weird stuff.

Originally posted by @JesusGod-Pope666-Info in #51 (reply in thread)

Suggestion based on this YouTube Video:

https://www.youtube.com/watch?v=QeNHHIjgvHU

i'm wondering how closely the bands of an "old school classic graphic equalizer" can be displayed.

https://www.engineeringtoolbox.com/octave-bands-frequency-limits-d_1602.html

i've tried plugging various values into octave-bands-viewer.html in the tools folder, but can't find any settings that work.
is it possible to manually define an array of custom bands?

i'm hoping to make a simple tool to assist in tuning a room, which engineers can load up in their web browser, either on a laptop with a reasonable external usb sound card, or on a phone for less acurate measurement (phone mics are not that great)

First of all, many thanks for making this wonderful piece.
This has been very useful for an educational purpose, especially to students working on DSP and/or phonetics.
Could you add an option to switch Logarithmic to linear scale?
This will be really informative in a certain area for sure.
Thanks!!

there is no setting to change the font size of “song info” and the position of left track info and the right info，I hope this feature will be added to soon！O(∩_∩)O

Amazing work!

If I play a steady tone into the microphone, the display "bounces" something like 3-4 times per second, as if the tone was pulsed.

Is that because live input is sampled in discrete chunks several times a second, and this an artifact of that technique? Is there a way to improve on this?

might be nice to be able to choose a folder even if it is loading.... As if I rename a folder and it loads, it just stalls..... I guess a reset of the cache of the browser might work. But I can't push the loading button and point out another folder which actually exist.

Originally posted by @JesusGod-Pope666-Info in #51 (comment)

I tried on the demo page with a stream on Safari 14.0.
The sound works nicely but the spectrum doesn't move. I tried all configuration but anyone change it.

So I downloaded a bunch of m3u files from a page somewhere, now they do seem to work in the VLC player but wont play in the audioMotion player. Not sure what is wrong, I thought my player just did not work with it, but as I downloaded your own in the demo and tested them, I found out it actually worked on those 3 live ones that usually works.

Not sure what is wrong or different, I see if I can check the with the txt app and see if there is something.

---- Darkijah

Keep enlightening our lives with your awesomeness!!!

Regards

Hugo Barbosa

It would be good to have option to disable playback of microphone input to speakers to avoid feedback loops.

Discussed in #56

Discussed in #56

Awesome work with AudioMotion.js i think this is not an issue but but i cant play an Icecast Stream in MP3 @ 192 kbps 44.1 KhZ or a m3u playlist with it.

Is there a way to have the track info remain on the screen continuously instead of fading away after a few seconds when a track changes, or when I press the keyboard shortcut? If not, could this be added as a feature in a future version?

Hey folks,

I'm trying to build a fancy audio visualizer with an old Mac mini and audioMotion.

I have a streamer as an audio source which I'd like to connect to my mac mini's line input to forward the song to audioMotion

Now, when using the headphone jack output on the streamer and connect it straight to the line-in of the mac mini, I'm experiencing no delay at all. Unfortunately though, when using the headphone jack of the streamer, it no longer sends audio to my amp (and thus to my speakers).

As I also have a headphone pre-amp, the Fostex HPA8 MK2, I tried connecting the streamer to the pre-amp with an optical cable, and then tried connecting the pre-amp's headphone output to the Mac mini's line-in input. When doing that, I'm experiencing audio delay, of roughly 200ms, which causes the audio spectrum to get out of sync with the audio getting out of my speakers.

I also tried using the analog RCA output of the pre-amp (using an RCA to jack cable), but the result is the same.

You might then immediately think that the delay then comes from the pre-amp, however, when connecting my headphones to the pre-amp and comparing it with my speakers, there's no delay experienced at all.

All of this makes me think there's some kind of buffer issue on the line-in input, but that still doesn't explain why I'm not experiencing such delay when connecting the mac mini straight to the headphone jack output of the streamer.

Do you folks have any idea what might be the cause? Do you think I could solve the problem by using a dumb USB sound card? Is there any way to decrease the line-in buffer, if that's even the cause? I know there are ways to do that via logic pro and all, but the use-case's different here.

I know this isn't directly related to audioMotion, so feel free to delete the issue if you think it's inappropriate.

Thanks anyway for the awesome tool 🙌

I need put this canvas on a another canvas, so I need this background is transparent, but I don't know how to set it to a transparent background, I've looked at the documentation, but there seems to be no way to do it.
your project is awesome, thank you build it!

Hi,

I was browsing audiomotion and I saw you included some radio stations I had (Im really happy). Im providing you with my up to date radio station m3u playlists. Thank you for helping me out in the past! Please feel free to include anything you want... Thank you!

radioSanta.zip

Hi,

I wanted to know if you could make a light UI for your app? I noticed your current player runs very slowly on mobile devices.

Thank you!