Pulsuz Audio Spektrum Analizatoru

Necə İşləyir

Audio Spektr Analizatoru tamamilə brauzerinizdə Web Audio API-nin AnalyserNode-undan istifadə edərək işləyir, bu isə bir fayldan və ya mikrofondan gələn audio məlumatı üzərində real-vaxt FFT (Sürətli Furye Çevrilməsi) hesablayır. Hər kadr əl ilə yazılmış Canvas 2D kodu ilə çəkilir — heç bir vizuallaşdırma kitabxanası iştirak etmir, heç bir audio cihazınızı tərk etmir.

1. 1
   Audio dekodlanır və istiqamətləndirilir

   Bir fayl yüklədiyinizdə, Web Audio API onu bir AudioBuffer-ə dekodlayır və bir MediaElementAudioSourceNode vasitəsilə bir AnalyserNode-a istiqamətləndirir. Mikrofon girişi üçün getUserMedia() axını tutur və onu bunun əvəzinə bir MediaStreamAudioSourceNode vasitəsilə bəsləyir — xam siqnalı görməniz üçün əks-səda ləğvi, küy azaltması və avtomatik qazanc söndürülmüş halda.
2. 2
   AnalyserNode hər kadrda FFT işlədir

   Hər animasiya kadrında (requestAnimationFrame vasitəsilə), kod cari FFT amplitüd spektrini dBFS ilə oxumaq üçün getFloatFrequencyData()-nı, xam dalğa forması nümunələri üçün isə getFloatTimeDomainData()-nı çağırır. FFT ölçüsü 2048-dən 16384 bin-ə qədər konfiqurasiya edilə bilər, 44.1 kHz-də bin başına təxminən 2.7 Hz qədər incə tezlik ayırdetmə qabiliyyəti verir.
3. 3
   Canvas 2D seçilmiş görünüşü render edir

   Analizator görünüşü FFT binlərini loqarifmik tezlik (20 Hz–20 kHz) X oxuna və dBFS Y oxuna xəritələyir, spektri dolu xətt kimi çəkir və solan pik-tutma izini üst-üstə qoyur. Üstün tezlik pik binin ətrafında parabolik interpolyasiya ilə dəqiqləşdirilir, sonra göstəricidə sent sapması ilə birlikdə ən yaxın bərabər temperli musiqi notuna (A4=440 Hz) çevrilir. Spektroqram görünüşü kanvası hər kadrda bir piksel sola sürüşdürür və inferno üslublu rəng keçidi ilə yeni sütun boyayır. Bədii görünüş bar, dalğa forması və ya dairəvi dekorativ rejimlər üçün bayt dəqiqlikli tezlik və ya zaman sahəsi məlumatından istifadə edir.
4. 4
   Canvas və MediaRecorder vasitəsilə ixrac

   PNG saxlamaq cari kadrı kodlaşdırmaq üçün canvas.toBlob()-u çağırır. Video yazmaq bir MediaStreamAudioDestinationNode-dan bir audio çıxışı ilə birləşdirilmiş canvas.captureStream(30)-dan istifadə edir, WebM və ya MP4 yaradan bir MediaRecorder-ə ötürülür. WAV ixracı DataView istifadə edərək AudioBuffer-dən 16-bit PCM RIFF faylını əl ilə kodlaşdırır — xarici kodlayıcı yoxdur.

Əlaqəli Alətlər