如何用JS合成正弦音频波?

时间:2016-10-11 20:38:05

标签: javascript html5 audio html5-audio synthesizer

我想尝试使用JavaScript制作合成器,但我找不到任何关于如何做的基本示例。

我从研究中得出的结论是appears to be possible并且你应该use a Canvas Pixel Array而不是普通的ECMA数组

我也在MDN Audio找到了信息,我之前看过网络广播播放器用于连续播放的音频元素,虽然我无法弄清楚如何。

我的目标是制作一些东西,让我能够合成连续的sin波并使用我的键盘播放它们,而不使用预先制作的样本

编辑:下面的评论之一指出了我正确的方向。我目前正在研究解决方案,但如果您想发布一个解决方案,请随意。

1 个答案:

答案 0 :(得分:0)

这是一个基本的例子,任何人都应该能够弄清楚如何用键盘来演奏正弦波:

<script type="text/javascript">
    //WARNING: VERY LOUD.  TURN DOWN YOUR SPEAKERS BEFORE TESTING

    // create web audio api context
    var audioCtx = new (window.AudioContext || window.webkitAudioContext)();

    // create Oscillator node
    var oscillator = audioCtx.createOscillator();

    oscillator.type = 'sine';
    oscillator.frequency.value = 750; // value in hertz
    oscillator.connect(audioCtx.destination);
    oscillator.start();

    //uncomment for fun
    // setInterval(changeFreq, 100);

    //choose a random interval from a list of consonant ratios
    var intervals = [1.0, 0.5, 0.3333, 1.5, 1.3333, 2.0, 2.25]
    function changeFreq() {
        var intervalIndex = ~~(Math.random() * intervals.length);
        var noteFreq = oscillator.frequency.value * intervals[intervalIndex];

        //because this is random, make an effort to keep it in comfortable frequency range.
        if(noteFreq > 1600) 
            noteFreq *= 0.5;
        else if(noteFreq < 250) 
            noteFreq *= 2;


        oscillator.frequency.value = noteFreq;
    }
</script>

<body>
<button onclick="changeFreq()">Change Places!</button>
</body>