मुफ़्त ऑडियो स्पेक्ट्रम विश्लेषक

यह कैसे काम करता है

ऑडियो स्पेक्ट्रम एनालाइज़र पूरी तरह आपके ब्राउज़र में Web Audio API के AnalyserNode का उपयोग करके चलता है, जो एक फ़ाइल या माइक्रोफ़ोन से ऑडियो डेटा पर रीयल-टाइम FFT (Fast Fourier Transform) गणना करता है। हर फ़्रेम हाथ से लिखे Canvas 2D कोड से बनाया जाता है — कोई विज़ुअलाइज़ेशन लाइब्रेरी शामिल नहीं, और कोई ऑडियो आपके डिवाइस से बाहर नहीं जाता।

1. 1
   ऑडियो डिकोड और रूट किया जाता है

   जब आप एक फ़ाइल लोड करते हैं, Web Audio API इसे एक AudioBuffer में डिकोड करता है और इसे MediaElementAudioSourceNode के ज़रिए एक AnalyserNode में रूट करता है। माइक्रोफ़ोन इनपुट के लिए, getUserMedia() स्ट्रीम कैप्चर करता है और इसके बजाय इसे MediaStreamAudioSourceNode के ज़रिए फ़ीड करता है — इको कैंसलेशन, नॉइज़ सप्रेशन, और ऑटो-गेन सब बंद करके ताकि आप रॉ सिग्नल देखें।
2. 2
   AnalyserNode हर फ़्रेम में FFT चलाता है

   हर एनिमेशन फ़्रेम पर (requestAnimationFrame के ज़रिए), कोड dBFS में वर्तमान FFT मैग्निट्यूड स्पेक्ट्रम पढ़ने के लिए getFloatFrequencyData() को, और रॉ वेवफ़ॉर्म सैंपलों के लिए getFloatTimeDomainData() को कॉल करता है। FFT साइज़ 2048 से 16384 बिन तक कॉन्फ़िगर करने योग्य है, जो 44.1 kHz पर लगभग 2.7 Hz/बिन जितनी बारीक फ़्रीक्वेंसी रिज़ॉल्यूशन देता है।
3. 3
   Canvas 2D चुना हुआ व्यू रेंडर करता है

   एनालाइज़र व्यू FFT बिन को लॉग-फ़्रीक्वेंसी (20 Hz–20 kHz) X अक्ष और dBFS Y अक्ष पर मैप करता है, स्पेक्ट्रम को एक भरी हुई लाइन के रूप में खींचता है, और एक घटते पीक-होल्ड ट्रेस को ओवरले करता है। प्रमुख फ़्रीक्वेंसी पीक बिन के आसपास परवलयिक इंटरपोलेशन का उपयोग करके पहचानी जाती है, फिर रीडआउट में सेंट डेविएशन के साथ निकटतम इक्वल-टेम्पर्ड म्यूज़िकल नोट (A4=440 Hz) में बदली जाती है। स्पेक्ट्रोग्राम व्यू हर फ़्रेम में कैनवस को एक पिक्सेल बाईं ओर स्क्रॉल करता है और एक inferno-स्टाइल कलर रैंप का उपयोग करके एक नया कॉलम पेंट करता है। आर्टिस्टिक व्यू बार, वेवफ़ॉर्म, या सर्कुलर डेकोरेटिव मोड के लिए बाइट-रिज़ॉल्यूशन फ़्रीक्वेंसी या टाइम-डोमेन डेटा उपयोग करता है।
4. 4
   Canvas और MediaRecorder के ज़रिए एक्सपोर्ट

   PNG सेव करने पर canvas.toBlob() वर्तमान फ़्रेम को एनकोड करने के लिए कॉल होता है। वीडियो रिकॉर्ड करने में MediaStreamAudioDestinationNode से एक ऑडियो टैप के साथ मिलाकर canvas.captureStream(30) उपयोग होता है, जो WebM या MP4 बनाने वाले MediaRecorder में पाइप होता है। WAV एक्सपोर्ट DataView का उपयोग करके AudioBuffer से एक 16-बिट PCM RIFF फ़ाइल हाथ से एनकोड करता है — कोई बाहरी एनकोडर नहीं।

संबंधित टूल