2016-03-22 8 views
0

Ich mache einen Drumcomputer/Sampler und möchte, dass der Benutzer die Verzerrung der Ausgabe mit einem Schieberegler steuern kann. Ich habe einen WaveShaper-Knoten erstellt, ihn entsprechend verbunden, die Kurve mit einer Gleichung auf dieser Site festgelegt, alles funktioniert einwandfrei.Ändern der Kurve eines WebAudio WaveShaper-Knotens während der Wiedergabe

Dann möchte ich einen Range-Eingang eine Funktion auf dem Change Event aufrufen, um die Kurve zurückzusetzen, um mehr oder weniger Verzerrung entsprechend dem neuen Wert des Inputs zur Verfügung zu stellen.

Hier ist, was ich habe:

// Distortion: 
bussDistortion = audioContext.createWaveShaper(); 
bussDistortion.curve = makeDistortionCurve(0); 
bussDistortion.connect(audioContext.destination); 
// Slider: 
distortionAmountSlider = document.querySelector('#distortion_amount'); 
// Event listener: 
distortionAmountSlider.addEventListener('change', changeDistortionAmount, false); 

// Update function: 
function changeDistortionAmount() { 
    bussDistortion.curve = makeDistortionCurve(distortionAmountSlider.value); 
} 

function makeDistortionCurve(amount) { 
    var k = typeof amount === 'number' ? amount : 50, 
     n_samples = 44100, 
     curve = new Float32Array(n_samples), 
     i = 0, 
     x; 
    for (; i < n_samples; ++i) { 
     x = i * 2/n_samples - 1; 
     curve[i] = (Math.PI + k) * x * (1/6)/(Math.PI + k * Math.abs(x)); 
    } 
    return curve; 
} 

Was ist passiert zu sein scheint, dass die erste Änderung des Schiebers die Verzerrungskurve bewirkt, etwas zu ändern, aber nach, dass weitere Änderungen haben keine Auswirkungen. Kann mir jemand erklären, was passiert?

Antwort

0

Ich denke, das ist, wo es schief geht:

var k = typeof amount === 'number' ? amount : 50 

Der Wert der Schieber ein String ist, keine Zahl, was erklären würde, warum es das erste Mal funktioniert (es wertet bis 50). Also, wenn Sie tun

makeDistortionCurve(parseInt(distortionAmountSlider.value, 10)); 

sollten Sie gut zu gehen! (Oder verwenden Sie parseFloat, wenn Sie einen Schwimmer benötigen ..)

+0

Vielen Dank! Das ist es genau. Ich habe den ternären Operator vorher noch nie benutzt, ich hätte nachsehen sollen, bevor ich den Code kopiere :) –

Verwandte Themen