Определение частот в JS AudioContext.analyserNode

ОБЩАЯ ИНФОРМАЦИЯ

Моя цель — создать веб-приложение на основе JavaScript для анализа и отображения информации о частоте в источниках звука, как в источниках на странице (тег <audio>), так и в сигналах, передаваемых с микрофона клиента. я уже в пути :)

Как увлеченный саксофонист, одной из моих целей является сравнение информации, содержащейся в тоне разных саксофонистов и инструментов, путем изучения распределения верхних тонов по отношению к основному тону. Короче говоря, я хочу получить представление о том, почему разные инструменталисты и марки инструментов звучат по-разному даже при игре на одной высоте. Кроме того, я хочу сравнить настройку и частотное распределение различных «альтернативных аппликатур» с традиционными или стандартными аппликатурами того же исполнителя/инструмента.

Доступ и отображение информации о частоте — это довольно тривиальная задача с использованием JS AudioContext.analyserNode, который я использую в сочетании с элементом HTML5 Canvas для создания карты частот или «гистограммы в стиле winamp», похожей на найденную 'Визуализации с API веб-аудио' @ MDN.

ПРОБЛЕМА

Для достижения моей цели мне нужно идентифицировать некоторую конкретную информацию в источнике звука, особенно частоту в герцах основного тона, для прямого сравнения между инструменталистами/инструментами и частотным диапазоном источника. , чтобы определить частотный спектр интересующих меня звуков. Эту информацию можно найти в переменной fData ниже...

// example...
var APP = function() {
    // ...select source and initialise etc..

    var aCTX = new AudioContext(),
        ANAL = aCTX.createAnalyser(),
        rANF = requestAnimationFrame,
        ucID = null;

    ANAL.fftSize = 2048;

    function audioSourceStream(stream) {

        var source = aCTX.createMediaStreamSource(stream);
        source.connect(ANAL);

        var fData = new Uint8Array(ANAL.frequencyBinCount);

        (function updateCanvas() {
            ANAL.getByteFrequencyData(fData);

            // using 'fData' to paint HTML5 Canvas

            ucID = rANF(updateCanvas);
        }());
    }
};

ПРОБЛЕМЫ

Хотя я могу легко представить fData в виде гистограммы или линейного графика и т. д. с помощью <canvas> API, чтобы основные и верхние части источника звука были четко видны, до сих пор я не смог определить...

• Диапазон частот fData (мин-макс Гц)
• Частота каждого значения в fData (Гц)

Без этого я не могу приступить к определению доминирующей частоты источника (чтобы сравнить вариации в настройке с традиционными названиями музыкальных тонов) и/или выделить или исключить области представленного спектра (увеличение или уменьшение масштаба и т. д.) для более подробного изучения.