Я должен создать код JavaScript для подключения к микрофону (даже внешний) и отображать спектаграмму в диапазоне ультразвуков: от 22 кГц до 48 кГц (по крайней мере).
По-видимому, должен быть узкий центр с помощью API веб-аудио (см. Изображение) (см. Изображение). /> Введите описание изображения здесь < /p>
Пожалуйста, обратите внимание, что: < /p>
Браузер дает необходимую скорость выборки 96 кГц. 96 кГц). < /Li>
Я попытался повторить тот же код, используя API Analyzernode, и проблема все еще существует.
Improved Spectrogram with Extended Ultrasound Range
body { font-family: Arial, sans-serif; text-align: center; }
.controls { margin-bottom: 1em; }
.container {
display: flex;
flex-direction: row;
justify-content: center;
align-items: flex-start;
margin: 0 auto;
position: relative;
width: fit-content;
}
.axis-container {
position: relative;
width: 50px;
height: 300px;
margin-right: 10px;
}
.tick {
position: absolute;
white-space: nowrap;
transform: translateY(-50%);
font-size: 12px;
right: 0;
}
canvas { border: 1px solid black; display: block; }
Improved Spectrogram
(Microphone Input with Extended Ultrasound Range)
Start Spectrogram
Y‑Scale:
Log
Linear
Spectrogram visualizing the microphone audio signal with enhanced dynamic range and color mapping.
// --------------------
// Global Audio & FFT Parameters
// --------------------
let sampleRate = 96000; // Requested sample rate (will be updated from AudioContext)
const fftSize = 4096; // FFT size (power of 2)
const MIN_FREQ = 20; // Lowest frequency to display (Hz)
const NUM_TICKS = 8; // Number of ticks on Y-axis
let scaleMode = "log"; // "log" or "linear"
let canvas, canvasCtx;
// Microphone buffer & AudioContext variables:
let micBuffer = new Float32Array(fftSize);
let micBufferAvailable = false;
let audioContext, scriptProcessor;
// --------------------
// FFT Implementation (Cooley-Tukey)
// --------------------
function bitReverse(x, bits) {
let y = 0;
for (let i = 0; i < bits; i++) {
y = (y >>= 1;
}
return y;
}
function fft(re, im) {
const n = re.length;
const levels = Math.log2(n);
for (let i = 0; i < n; i++) {
const j = bitReverse(i, levels);
if (j > i) {
[re, re[j]] = [re[j], re];
[im, im[j]] = [im[j], im];
}
}
for (let size = 2; size {
scaleMode = scaleSelect.value;
drawYAxis();
};
drawYAxis();
}
// --------------------
// Start Microphone Capture and Animation
// --------------------
async function startMic() {
try {
// Request a 96 kHz sample rate (if supported by the browser/hardware)
audioContext = new (window.AudioContext || window.webkitAudioContext)({sampleRate: 96000});
console.log("AudioContext sampleRate:", audioContext.sampleRate);
sampleRate = audioContext.sampleRate; // update sample rate
const stream = await navigator.mediaDevices.getUserMedia({ audio: true, video: false });
const source = audioContext.createMediaStreamSource(stream);
// Create a ScriptProcessorNode with a buffer size equal to fftSize.
scriptProcessor = audioContext.createScriptProcessor(fftSize, 1, 1);
scriptProcessor.onaudioprocess = function(audioProcessingEvent) {
let inputBuffer = audioProcessingEvent.inputBuffer;
let channelData = inputBuffer.getChannelData(0);
micBuffer.set(channelData);
micBufferAvailable = true;
};
source.connect(scriptProcessor);
scriptProcessor.connect(audioContext.destination);
// Start the animation loop.
animate();
} catch (e) {
alert('Error accessing microphone: ' + e);
}
}
function startTest() {
setupSpectrogram();
startMic();
}
// --------------------
// Spectrogram Animation Using Microphone Data
// --------------------
function animate() {
requestAnimationFrame(animate);
if (!micBufferAvailable) return; // Wait for microphone data
// Copy the microphone buffer for processing.
let signal = new Float32Array(micBuffer);
micBufferAvailable = false;
// Apply a Hamming window to reduce spectral leakage.
for (let i = 0; i < fftSize; i++) {
let windowVal = 0.54 - 0.46 * Math.cos(2 * Math.PI * i / (fftSize - 1));
signal *= windowVal;
}
// Prepare arrays for FFT.
let re = new Float32Array(signal);
let im = new Float32Array(fftSize); // automatically zeroed
fft(re, im);
// Compute magnitudes for the first half (Nyquist).
const halfSize = fftSize / 2;
let magnitudes = new Float32Array(halfSize);
for (let i = 0; i < halfSize; i++) {
magnitudes = Math.sqrt(re * re + im * im);
}
// Convert magnitudes to decibels.
let dBArray = new Float32Array(halfSize);
for (let i = 0; i < halfSize; i++) {
dBArray[i] = 20 * Math.log10(magnitudes[i] + 1e-10);
}
// Use a fixed dynamic range (-80 dB to 0 dB) for mapping.
const minDB = -80, maxDB = 0;
let dataArray = new Uint8Array(halfSize);
for (let i = 0; i < halfSize; i++) {
let intensity = ((dBArray[i] - minDB) / (maxDB - minDB)) * 255;
intensity = Math.max(0, Math.min(255, intensity));
dataArray[i] = intensity;
}
// Shift the canvas left by 1 pixel.
const width = canvas.width, height = canvas.height;
const oldImage = canvasCtx.getImageData(1, 0, width - 1, height);
canvasCtx.putImageData(oldImage, 0, 0);
// Draw a new column on the right using the FFT data.
const maxFreq = sampleRate / 2;
for (let y = 0; y < height; y++) {
const freq = yToFreq(y, height, MIN_FREQ, maxFreq);
const index = freqToIndex(freq, maxFreq, halfSize);
const intensity = dataArray[index];
canvasCtx.fillStyle = intensityToColor(intensity);
canvasCtx.fillRect(width - 1, y, 1, 1);
}
}
< /code>
Если я генерирую цифровой сигнал с помощью JavaScript вместо того, чтобы подключаться к микрофону с помощью веб -аудио -API, код (FFT) делает спектограмму правильно, поэтому я думаю, что я подозреваю, что на уровне AudioContext. Защищен классом, к которому нельзя получить доступ через этот API.>
Подробнее здесь: https://stackoverflow.com/questions/795 ... ency-22khz
Захват ультразвук с частотой API веб -аудио> 22 кГц ⇐ Javascript
-
- Похожие темы
- Ответы
- Просмотры
- Последнее сообщение
-
-
Как записать в стерео в 48 кГц с использованием AvaudioEngine и Avaudiosession на iOS?
Anonymous » » в форуме IOS - 0 Ответы
- 3 Просмотры
-
Последнее сообщение Anonymous
-
-
-
Как записать в стерео в 48 кГц с использованием AvaudioEngine и Avaudiosession на iOS?
Anonymous » » в форуме IOS - 0 Ответы
- 7 Просмотры
-
Последнее сообщение Anonymous
-
-
-
Как транслировать видео и аудио с Raspi на веб -сайт и вернуть аудио [закрыто]
Anonymous » » в форуме Python - 0 Ответы
- 5 Просмотры
-
Последнее сообщение Anonymous
-
-
-
Захват аудио с JavaScript и воспроизводить его сразу же бросает ошибку в Audio
Anonymous » » в форуме Html - 0 Ответы
- 7 Просмотры
-
Последнее сообщение Anonymous
-
-
-
Захват аудио с JavaScript и воспроизводить его сразу же бросает ошибку в Audio
Anonymous » » в форуме Javascript - 0 Ответы
- 8 Просмотры
-
Последнее сообщение Anonymous
-