AnalyserNode.getByteTimeDomainData()

AnalyserNode.getByteTimeDomainData() - копіює поточну форму хвилі сигналу у масив Uint8Array.

Синтаксис:

AnalyserNode.getByteTimeDomainData(array);

Параметри:

AnalyserNode - об'єкти AnalyserNode.

array - змінна, масив типу Uint8Array в який буде скопійовані дані поточної форми хвилі сигналу.

Опис:

getByteTimeDomainData() метод об'єкта AnalyserNode який копіює поточну форму хвилі сигналу у масив Uint8Array.

Якщо потрібна більша точнісь і менша продуктивність тоді використовуйте метод AnalyserNode.getFloatTimeDomainData().

Приклад:

if(window.AudioContext){
	var div=document.getElementById('results');
	var audio = new AudioContext();
	var player = document.getElementById('player');
	var source = audio.createMediaElementSource(player);
	var analis=audio.createAnalyser();
	source.connect(analis);
	analis.connect(audio.destination);
	analis.fftSize=32;
	mas = new Uint8Array(analis.frequencyBinCount);
	
	function draw(){
		analis.getByteTimeDomainData(mas);
		for(var i=0,s='';i<mas.length;i++)
		s+=' '+mas[i];
		div.innerHTML=s;
		setTimeout(draw,50);
	}
	draw();
	player.play();
}else alert('Ваш браузер не підтримує Web Audio');

<canvas id="canvas2"></canvas>
<audio id="player2" src="/dani/test.ogg"></audio>

if(window.AudioContext){
	audio2 = new AudioContext();
	player2 = document.getElementById('player2');
	source2 = audio2.createMediaElementSource(player2);
	analis2=audio2.createAnalyser();
	canvas2=document.getElementById('canvas2');
	ctx2=canvas2.getContext('2d');
	source2.connect(analis2);
	analis2.connect(audio2.destination);
	analis2.fftSize=128;
	dani2 = new Uint8Array(analis2.frequencyBinCount);
	
	draw2=function(){ //функція яка відображає отримані дані частот на полотні canvas
		analis2.getByteTimeDomainData(dani2);
		ctx2.fillStyle='black';
		ctx2.fillRect(0, 0, canvas2.width, canvas2.height);
		ctx2.lineWidth=2;
		ctx2.strokeStyle='red';
		ctx2.beginPath();
		var w=canvas2.width/dani2.length;
		ctx2.moveTo(x,dani2[i-2]);
		for(var i=1,x=0;i<dani2.length;i++,x+=w){
			ctx2.lineTo(x,dani2[i]);
		}
		ctx2.lineTo(x+w,dani2[i-2]);
		ctx2.stroke();
		
		setTimeout(draw2,50); //або requestAnimationFrame(draw)
	}
	draw2();
	player2.play();
}else alert('Ваш браузер не підтримує Web Audio');

if(window.AudioContext){
	var audio3 = new AudioContext();
	var player3 = document.getElementById('player3');
	var source3 = audio3.createMediaElementSource(player3);
	var analis3=audio3.createAnalyser();
	var canvas3=document.getElementById('canvas3');
	var ctx3=canvas3.getContext('2d');
	source3.connect(analis3);
	analis3.connect(audio3.destination);

	analis3.fftSize=64;
	dani3 = new Uint8Array(analis3.frequencyBinCount);
	
	function draw3(){ //функція яка відображає отримані дані частот на полотні canvas
		analis3.getByteTimeDomainData(dani3);
		ctx3.fillStyle='black';
		ctx3.fillRect(0, 0, canvas3.width, canvas3.height);
		ctx3.fillStyle='red';
		var w=Math.ceil(canvas3.width/dani3.length);
		for(var i=0,x=0;i<dani3.length;i++,x+=w)
		ctx3.fillRect(x,dani3[i],w,canvas3.height);
		
		setTimeout(draw3,50);
	}
	draw3();
	player3.play();
}else alert('Ваш браузер не підтримує Web Audio');