Тема: Візуалізація гучності мікрофону.
Доброго дня.
Мені треба зробити візуалізацію перевірки гучності мікрофону.
Суть у тому, що вона має бути схожою на перевірку як у скайпі, або як на цьому сервісі: https://onlinedoctor.ru/test/
Я вже написав код для доступу до мікрофону і щоб він вмикався і зчитував звук:
function() {
if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
navigator.mediaDevices.getUserMedia({audio : true}).then (
function (stream){
var AudioContext = window.AudioContext || window.webkitAudioContext;
var ctx = new AudioContext();
var source = ctx.createMediaStreamSource(stream);
var analyser = ctx.createAnalyser();
console.log(analyser);
var processor = ctx.createScriptProcessor(2048, 1, 1);
source.connect(analyser);
source.connect(processor);
// analyser.connect(ctx.destination); //conect with yuor dinamics
processor.connect(ctx.destination);
analyser.fftSize = 128;
//if you want listen you microphone decoment next code
// var data = new Uint8Array(analyser.frequencyBinCount);
// processor.onaudioprocess = function (){
// analyser.getByteFrequencyData(data);
// console.log(data);
// }
}
);
}
}Як тепер зробити візуалізацію, щоб при зміні гучності мікрофона відповідно замальовувалась риска-індикатор?