Analizor Spectru Audio — gratuit

Cum funcționează

Analizorul de Spectru Audio rulează în întregime în browser-ul tău folosind AnalyserNode al API-ului Web Audio, care calculează o FFT (Transformată Fourier Rapidă) în timp real pe datele audio dintr-un fișier sau microfon. Fiecare cadru este desenat cu cod Canvas 2D scris manual — nicio bibliotecă de vizualizare nu este implicată, și niciun audio nu părăsește dispozitivul tău.

1. 1
   Audio-ul este decodat și rutat

   Când încarci un fișier, API-ul Web Audio îl decodează într-un AudioBuffer și îl rutează printr-un MediaElementAudioSourceNode într-un AnalyserNode. Pentru intrarea de microfon, getUserMedia() captează fluxul și îl alimentează printr-un MediaStreamAudioSourceNode în schimb — cu anularea ecoului, suprimarea zgomotului și câștigul automat toate dezactivate astfel încât vezi semnalul brut.
2. 2
   AnalyserNode rulează FFT-ul la fiecare cadru

   La fiecare cadru de animație (prin requestAnimationFrame), codul apelează getFloatFrequencyData() pentru a citi spectrul curent de magnitudine FFT în dBFS, și getFloatTimeDomainData() pentru eșantioanele brute ale formei de undă. Dimensiunea FFT este configurabilă de la 2048 la 16384 bin-uri, oferind rezoluție de frecvență la fel de fină ca aproximativ 2,7 Hz/bin la 44,1 kHz.
3. 3
   Canvas 2D randează vizualizarea aleasă

   Vizualizarea Analizor mapează bin-urile FFT pe o axă X logaritmică de frecvență (20 Hz–20 kHz) și o axă Y dBFS, desenează spectrul ca o linie umplută, și suprapune o urmă de vârf care se estompează. Frecvența dominantă este localizată exact folosind interpolare parabolică în jurul bin-ului de vârf, apoi convertită la cea mai apropiată notă muzicală temperată egal (A4=440 Hz) cu deviația în cenți afișată în citire. Vizualizarea Spectrogramă derulează canvas-ul un pixel spre stânga la fiecare cadru și pictează o coloană nouă folosind o gamă de culori stil inferno. Vizualizarea Artistică folosește date de frecvență sau domeniu-timp la rezoluție de byte pentru moduri decorative de bară, formă de undă, sau circular.
4. 4
   Export prin Canvas și MediaRecorder

   Salvarea unui PNG apelează canvas.toBlob() pentru a codifica cadrul curent. Înregistrarea unui video folosește canvas.captureStream(30) combinat cu o captare audio dintr-un MediaStreamAudioDestinationNode, direcționat printr-un MediaRecorder producând WebM sau MP4. Exportul WAV codifică manual un fișier RIFF PCM pe 16 biți din AudioBuffer folosind un DataView — fără codificator extern.

Instrumente similare