时间戳

首页 > 解决方案 > Web Audio API 无法将数据卸载到 .csv 文件中以构建图形？

javascript - Web Audio API 无法将数据卸载到 .csv 文件中以构建图形？

问题描述

任务。

目标是通过除以 10 部分（即沿垂直轴的 10% 区域 - 这是频率）在 .csv 数组中以生成的频谱图的形式从Web Audio API卸载数据，然后将数据从数组加载到StreamGraph ,见 pic-1

源代码：

https://codepen.io/lolliuym/pen/GREjwNR?editors=1010

尝试。

1 - 定义在线和离线音频上下文

const AudioContext = window.AudioContext || window.webkitAudioContext;
const audioCtx = new AudioContext();
const offlineCtx = new OfflineAudioContext(2,44100*40,44100);

source = offlineCtx.createBufferSource();

2 - 使用 XHR 加载音轨并使用 decodeAudioData 对其进行解码并将数据插入缓冲区。然后将缓冲区放入源中。不幸的是，Web Audio API 没有提供创建新 .csv 文件的选项。这里的例子：

function getData() {
  request = new XMLHttpRequest();
  request.open('GET', 'audio.ogg', true);
  request.responseType = 'arraybuffer';
  request.onload = function() {
    let audioData = request.response;
    audioCtx.decodeAudioData(audioData, function(buffer) {
    myBuffer = buffer;
    source.buffer = myBuffer;
    source.connect(offlineCtx.destination);
    source.start();
    offlineCtx.startRendering();
  },
  function(e){"Error with decoding audio data" + e.err})}
request.send()}

我找到了一种使用existing.csv（默认为NULL）创建.csv 的方法，但我认为兼容性不会影响Web Audio API。还有其他方法吗？

总计。

在我所有的尝试中，我都未能创建 .csv 文件的内容，通过该文件将数据从 Web Audio API 卸载到可以在浏览器中播放的图形。

问题。

  1. 通过将 10 除以一个区域的部分来创建新的 .csv 文件的能力是什么？
  2. 有什么方法可以卸载？
  3. Streamgraph 计划如何连接到 .csv

标签： javascriptcsvaudioweb-audio-apispectrogram

解决方案

推荐阅读