Ձայնի սպեկտրի վերլուծիչ անվճար

Ինչպես է այն աշխատում

Աուդիո Սպեկտրի Վերլուծիչը լիովին աշխատում է ձեր դիտարկիչում՝ օգտագործելով Web Audio API-ի AnalyserNode-ը, որը հաշվարկում է իրական ժամանակի FFT (Արագ Ֆուրիե Ձևափոխություն) ֆայլից կամ խոսափողից ստացված աուդիո տվյալների վրա։ Ամեն կադր գծվում է ձեռագիր Canvas 2D կոդով — վիզուալիզացիայի ոչ մի գրադարան ներգրավված չէ, և աուդիոն չի հեռանում ձեր սարքից։

1. 1
   Աուդիոն վերծանվում և ուղղորդվում է

   Երբ բեռնում եք ֆայլ, Web Audio API-ն վերծանում է այն AudioBuffer-ի մեջ և ուղղորդում է MediaElementAudioSourceNode-ի միջոցով AnalyserNode-ի մեջ։ Խոսափողի մուտքագրման համար getUserMedia()-ն գրավում է հոսքը և փոխարենը սնուցում է այն MediaStreamAudioSourceNode-ի միջոցով — արձագանքի չեղարկումը, աղմուկի ճնշումը և ինքնաշխատ ուժեղացումն անջատված են, որպեսզի դուք տեսնեք հում ազդանշանը։
2. 2
   AnalyserNode-ն ամեն կադրում գործարկում է FFT-ն

   Ամեն անիմացիոն կադրում (requestAnimationFrame-ով), կոդը կանչում է getFloatFrequencyData()՝ ընթացիկ FFT ուժգնության սպեկտրը dBFS-ով կարդալու համար, և getFloatTimeDomainData()՝ հում ալիքաձևի նմուշների համար։ FFT չափը կարգավորելի է 2048-ից 16384 բին, տալով հաճախականային ընտրողականություն մինչև մոտավորապես 2.7 Հց/բին՝ 44.1 կՀց-ի դեպքում։
3. 3
   Canvas 2D-ն մատուցում է ընտրված տեսքը

   Վերլուծիչի տեսքը FFT բիները քարտեզագրում է լոգ-հաճախականային (20 Հց–20 կՀց) X առանցքի և dBFS Y առանցքի վրա, գծում է սպեկտրը որպես լցված գիծ, և վրադրում է թուլացող գագաթ-պահման հետք։ Գերակշռող հաճախականությունը ճշգրտվում է գագաթի բինի շուրջ պարաբոլիկ ինտերպոլացիայով, ապա փոխարկվում է ամենամոտ հավասարաչափ-կարգավորված երաժշտական նոտայի (A4=440 Հց)՝ ցենտային շեղումով ցուցադրվող։ Սպեկտրոգրամի տեսքը ոլորում է կտավը մեկ պիքսելով ձախ ամեն կադրում և գունավորում նոր սյունակ inferno-ոճի գունային սանդղակով։ Գեղարվեստական տեսքն օգտագործում է բայթ-որոշողականությամբ հաճախականային կամ ժամանակային տվյալներ գծային, ալիքաձևային կամ շրջանաձև զարդարման ռեժիմների համար։
4. 4
   Արտահանում Canvas-ի և MediaRecorder-ի միջոցով

   PNG պահելը կանչում է canvas.toBlob()՝ ընթացիկ կադրը կոդավորելու համար։ Տեսանյութ ձայնագրելը օգտագործում է canvas.captureStream(30)՝ զուգակցված MediaStreamAudioDestinationNode-ից աուդիո վերցնման հետ, փոխանցված MediaRecorder-ի մեջ, որն արտադրում է WebM կամ MP4։ WAV արտահանումը ձեռագիր կոդավորում է 16-բիթանոց PCM RIFF ֆայլ AudioBuffer-ից՝ օգտագործելով DataView — առանց արտաքին կոդավորիչի։

Առնչվող գործիքներ