Доступ к микрофону и аудиопотоку

ml5.js предоставляет высокоуровневый интерфейс для работы с машинным обучением в браузере. Одним из важных направлений является обработка аудио, включая распознавание речи, классификацию звуков и работу с микрофонным потоком. Для этого необходимо сначала получить доступ к микрофону и организовать обработку аудиопотока.

Настройка микрофона

Для работы с микрофоном в ml5.js используется встроенный объект p5.AudioIn из библиотеки p5.js, на которой основан ml5.js. Основные шаги:

let mic;

function setup() {
  noCanvas();
  mic = new p5.AudioIn();
  mic.start();
}
  • p5.AudioIn() создаёт объект, который управляет аудиопотоком с микрофона.
  • mic.start() инициирует запрос разрешения на доступ к устройству пользователя. Браузеры требуют явного согласия на использование микрофона.

Получение аудиопотока

После инициализации микрофона доступ к текущему уровню громкости осуществляется через метод:

let vol = mic.getLevel();

Метод getLevel() возвращает число от 0 до 1, которое отражает текущую амплитуду звука. Этот параметр можно использовать для визуализации звука или для анализа интенсивности сигнала.

Подключение к ml5.js для классификации звуков

ml5.js поддерживает несколько моделей для работы с аудио, например SoundClassifier, который позволяет классифицировать аудио в реальном времени. Для инициализации классификатора необходимо:

let classifier;
let options = { probabilityThreshold: 0.7 };

function preload() {
  classifier = ml5.soundClassifier('https://teachablemachine.withgoogle.com/models/your_model/model.json', options);
}
  • soundClassifier(url, options) загружает предварительно обученную модель.
  • options.probabilityThreshold задаёт минимальную вероятность для того, чтобы классификация считалась значимой.

После загрузки модели можно подключить поток с микрофона:

classifier.classify(gotResult);

function gotResult(error, results) {
  if (error) {
    console.error(error);
    return;
  }
  console.log(results[0].label, results[0].confidence);
}

Метод classify(callback) автоматически подключает микрофон, если он ещё не инициализирован, и передаёт аудиопоток модели для анализа. Результаты возвращаются в виде массива объектов с полями label и confidence, где label — название распознанного звука, а confidence — вероятность его корректного распознавания.

Использование потока для визуализации

Аудиопоток может быть использован для интерактивной визуализации. Например, изменение цвета или размера объектов в зависимости от громкости:

function draw() {
  background(200);
  let vol = mic.getLevel();
  let diameter = map(vol, 0, 1, 10, 200);
  ellipse(width / 2, height / 2, diameter, diameter);
}
  • map(value, start1, stop1, start2, stop2) преобразует диапазон громкости в диапазон, подходящий для визуализации.
  • Такой подход позволяет создавать динамические интерактивные эффекты, реагирующие на звук в реальном времени.

Управление разрешениями и совместимость

Браузеры требуют HTTPS для работы с микрофоном и обычно запрашивают явное разрешение пользователя. Для корректной работы рекомендуется:

  • Проверять наличие метода navigator.mediaDevices.getUserMedia.
  • Обрабатывать ошибки, связанные с отказом пользователя или отсутствием устройства.

Пример проверки:

if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
  mic.start();
} else {
  console.error('Микрофон недоступен');
}

Совместная работа с другими аудиокомпонентами

p5.js предоставляет возможность подключать аудиопоток к другим объектам, например p5.FFT для анализа спектра частот:

let fft;

function setup() {
  noCanvas();
  mic = new p5.AudioIn();
  mic.start();
  fft = new p5.FFT();
  fft.setInput(mic);
}

function draw() {
  let spectrum = fft.analyze();
  console.log(spectrum);
}
  • p5.FFT() позволяет получать спектр сигнала и использовать его для визуализации или анализа.
  • fft.setInput(mic) связывает микрофон с анализатором частот, что открывает возможности для более сложных аудиоприложений, таких как визуализация спектра в реальном времени или триггеры событий на основе звуковых характеристик.

Особенности работы с потоками в браузере

  • Поток аудио передается в браузере в режиме реального времени, поэтому важно минимизировать задержки обработки.
  • Использование методов ml5.js и p5.js обеспечивает асинхронную обработку и интеграцию с другими компонентами интерфейса.
  • Правильное управление жизненным циклом объектов (start, stop) позволяет экономить ресурсы и предотвращать утечки памяти.

Доступ к микрофону и работа с аудиопотоком в ml5.js представляет собой сочетание простоты интерфейса и гибкости, позволяя создавать интерактивные приложения для классификации, визуализации и анализа звука без необходимости низкоуровневого взаимодействия с Web Audio API.