javascript - 平滑数组中的值

Question

我正在使用 WebAudio API 和 Analyzer 节点可视化音频文件中的 FFT 数据。

你可以在这里看到它的演示: http://vagrantsophist.com/effects/audio.html(注意:目前仅适用于 Chrome，根据您的互联网连接，音频文件需要几秒钟的时间才能完成。)

我的问题:

右侧的 slider 应该确定可视化的平滑值。这是我为此使用的 javascript 代码:

 function smoothArray(array, smoothing) {
    var newArray = [];

    for (i = 0; i < array.length; i++) {
        var sum = 0;

        for (index = 0; index < (smoothing*2)+1; index++) {
            var thisVal = i - smoothing;
            if (thisVal < 0) {
                thisVal += array.length;
            };
            if (thisVal > array.length) {
                thisVal -= array.length;
            }
            sum += array[thisVal];
        }
        newArray[i] = sum/((smoothing*2)+1);
        index = 0;
    }

    return newArray;
}

var clippedArray = dataArray.subarray(0, 180);

var smoothedArray = smoothArray(clippedArray, document.getElementById("smoothing").value);

理论上，这应该是将前面的值、当前值和后面的值相加，然后取和的平均值。

但出于某种原因，它通过平滑 来偏移数组。

我已经玩了一个小时了，我看不出这里发生了什么。

有什么想法吗？

Answer 1

您只是在每次通过内部循环时减去相同的平滑 偏移量，而不是访问数组周围的所有元素。您需要将 index 从 i - smoothing 迭代到 i + smoothing，然后对数组的这些元素进行平均。

function smoothArray(array, smoothing) {
    var newArray = [];
    for (i = 0; i < array.length; i++) {
        var sum = 0;

        for (index = i - smoothing; index <= i + smoothing; index++) {
            var thisIndex = index < 0 ? index + array.length : index % array.length;
            sum += array[thisIndex];
        }
        newArray[i] = sum/((smoothing*2)+1);
    }

    return newArray;
}

var clippedArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16];
var smoothedArray = smoothArray(clippedArray, 2);
document.getElementById('result').textContent = JSON.stringify(smoothedArray);

<div id="result"></div>