Question

J'essaie de construire un générateur de forme d'onde qui obtiennent des valeurs d'amplitudes audiofiles et les affichent à une toile aussi rapide que possible (plus rapide que réel) en JavaScript. J'utilise donc l'OFFLINEAUDIOCONText / WebKitoffLineAudiOcontext, chargez le fichier et démarrez l'analyse. La forme d'onde est de remplir une large toile.

J'analyse du tampon dans une fonction processeur.AudioProcess. (Je suppose que c'est comme ça que ça marche?)

Cela fonctionne bien dans Firefox, mais j'ai un problème à Chrome: il semble qu'il "saute" sur beaucoup d'analyser pour terminer cela fonctionne le plus tôt possible et ne renvoie que quelques coordonnées (quelque chose comme 16).

Voici le jsfiddle: http://jsfiddle.net/bestiole/95ebf/

// create the audio context
if (! window.OfflineAudioContext) {
    if (! window.webkitOfflineAudioContext) {
        $('#output').append('failed : no audiocontext found, change browser');
    }
    window.OfflineAudioContext = window.webkitOfflineAudioContext;
}
//var context = new AudioContext();
var length = 15241583;
var samplerate = 44100;
var fftSamples = 2048;
var waveformWidth = 1920;

var context = new OfflineAudioContext(1,length,samplerate);
var source;
var splitter;
var analyser;
var processor;
var i=0;
var average;
var max;
var coord;

processor = context.createScriptProcessor(fftSamples, 1, 1);
processor.connect(context.destination);

analyser = context.createAnalyser();
analyser.smoothingTimeConstant = 0;
analyser.fftSize = fftSamples;

source = context.createBufferSource();
splitter = context.createChannelSplitter();
source.connect(splitter);
splitter.connect(analyser,0,0);

analyser.connect(processor);

context.oncomplete = function(){
    $('#output').append('<br />complete');
}

var request = new XMLHttpRequest();
request.open('GET', "http://www.mindthepressure.org/bounce.ogg", true);
request.responseType = 'arraybuffer';
request.onload = function(){
    $('#output').append('loaded ! ');
    context.decodeAudioData(request.response, function(buffer) {
        $('#output').append('starting analysis<br />');
        processor.onaudioprocess = function(e){
            var data =  new Uint8Array(analyser.frequencyBinCount);
            analyser.getByteFrequencyData(data);
            average = getAverageVolume(data);
            max = Math.max.apply(Math, data);
            coord = Math.min(average*2,255);
            coord = Math.round((max+coord)/2);
            ctx.fillStyle=gradient;
            ctx.fillRect(i,255-coord,1,255);
            console.log(i+' -> '+coord);
            i++;
        }
        source.buffer = buffer;
        source.start(0);
        context.startRendering();
    }, onError);
}
request.send();

function onError(e) {
    $('#output').append('error, check the console');
    console.log(e);
}

function getAverageVolume(array) {
    var values = 0;
    var average;
    var length = array.length;
    for (var k = 0; k < length; k++) {
        values += array[k];
    }
    average = values / length;
    return average;
}

(Voici une autre version qui oblige la forme d'onde à s'intégrer en 1920px de large et générer une forme de forme d'onde pour qui est intéressé: http:// jsfiddle .NET / BESTIOLE / E3RSX / )

Je n'ai vraiment pas le point, comment ne traitera pas de chrome chaque partie du fichier audio?

Merci pour une aide!

Était-ce utile?

La solution

chrome a un bogue dans les processeurs de script en mode hors connexion.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top