程序员经验分享-hwhale

JavaScript 中音频的波形可视化[重复]

2024-03-20

我正在尝试使用 JavaScript 显示音频文件的波形，但我什至不知道如何开始。我找到了音频数据API https://wiki.mozilla.org/Audio_Data_API#Working_Audio_Data_Demos，但我不熟悉大多数音频术语，并且真的不知道提供什么或如何操作它。我在 JavaScript 中找到了波形示例，但它们太复杂/我无法理解发生了什么。那么我的问题是：如何使用 JavaScript 在画布上创建歌曲的波形，其背后的过程到底是什么？


这是我书中的一些示例代码（HTML5 多媒体：开发和设计） http://html5multimedia.com正是这样做的；音频波形 http://www.html5multimedia.com/code/ch11/moz-audio-api-waveform.html。它使用Mozilla 音频数据 API https://wiki.mozilla.org/Audio_Data_API.

该代码只是拍摄音频数据的快照并使用它在画布上绘制。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

html

Audio

canvas

html5audio

JavaScript 中音频的波形可视化[重复] 的相关文章

  • 了解执行模型和事件循环

    我读过很多关于JavaScript单线程执行模型 事件循环和事件队列的文章 但有一件事尚不清楚 我创建了一个小提琴来说明我的问题 http jsfiddle net yzpmf67f http jsfiddle net yzpmf67f

  • 一个文本区域中的文本应复制到另一个文本区域，并且应使用 JavaScript 单击按钮清除原始文本区域

    我已经完成了以下代码 它显示两个文本区域 其中一个文本区域中的文本通过使用 javascript 单击按钮复制到另一个文本区域

  • 表单未使用 AJAX 提交

    再次更新 如果有人关心的话 我之前发布的解决方案由于某种原因停止工作 我在 ajax 请求中包含了 beforeSend 并将验证表单的 js 部分粘贴到其中 现在就像一个魅力 form on submit function e e pre

  • 对 JavaScript 中的 while 循环感到困惑

    我可能在这里有点厚重 但请回答我这个问题 考虑以下代码 a 1 while a lt 6 console log a a 如果我运行这个 我会在控制台中得到从 1 到 6 的值 然后是另一个 6 现在看看这个 a 1 while a lt

  • JavaScript 中的 Promise.all：如何获取所有 Promise 的解析值？

    我编写了以下node js文件 var csv require csv parser var fs require fs var Promise require bluebird var filename devices csv var d

  • 如何使用 jquery 从 iframe 内部滚动？

    我正在使用一个 Shadowbox 它生成一个 iframe 以在页面上显示产品详细信息 由于详细信息页面可能相当长 因此客户端需要一个 更多 按钮来向下滚动页面 显然 iframe 右侧的滚动条还不够 这是我为了让 iframe 滚动而尝

  • GeoJSON 要素坐标未显示在 OpenLayers 地图上

    我正在尝试显示一个GeoJSON地图上的多边形 我使用了 OpenLayers 提供的示例以及以下数据 但仅显示第二个多边形 var geojsonObject type FeatureCollection crs type name fe

  • 嵌套对象的 AJV 模式验证

    函数返回的对象看起来像这样 answer vehicle type 1 message Car model VW color red 答案 对象始终存在 其他字段基于 vehicle type E g 如果vehicle type 1 则有

  • 向 FTP 服务器执行跨域 XMLHTTPREQUEST 的语法是什么？

    我有一个 webDav CORS 插件 可以使用它在 webDav 服务器上 POST PUT GET REMOVE ALLDOCS 文件 我现在想对 FTP 做同样的事情 但我正在努力获取xmlhttprequest 工作语法 我只是收到

  • HTML5 拖放 - 没有透明度？

    当我将一个元素拖放到页面上时 该元素会变成 幻影 基本上它获得了一些透明度值 有什么办法可以做到吗opacity 1 看来是做不到了 拖动的元素被放入具有自己的不透明度 低于 1 的容器中 这意味着虽然您可以降低拖动元素的不透明度 但您无法

  • 日期时间的自定义 JavaScriptConverter？

    我有一个对象 它有一个 DateTime 属性 我想通过 AJAX JSON 将该对象从 ashx 处理程序传递回网页 我不想使用第 3 方控件 当我这样做时 new JavaScriptSerializer Serialize DateT

  • 反转二进制网络

    如何反转二元方程 以便找到哪些输入将产生给定的输出 Example Inputs i0 through i8 Outputs o0 through o8 Operators XOR AND 二元方程 1 i0 1 i1 0 i2 1 i3

  • 为什么这个 CSS nowrap 不起作用？

    我试图阻止 bar top container div 包裹它的内容 无论页面有多宽 即两个选择应该始终出现在同一行 但是当页面宽度太小而无法容纳它们时 这不起作用一方面 我该如何解决这个问题 Styles bar top containe

  • 检查 href 中是否存在 jQuery 中的查询字符串

    我目前有一段 jQuery 用于附加带有一些位置信息的 URL jQuery a attr href function return this href location 123 abc 我的问题是大多数链接都有一个 其中使用上面的 就可以

  • 如何在 svelte 中制作搜索过滤器

    我有两个组件在组件树中距离很远 我对如何在两者之间进行通信存有疑问 我有搜索组件 listItems 和商店 商店 svelte

  • 如何在变量名中使用变量

    所以我正在使用这样的 json 变量 opponentInvData item1 它包含项目 1 到 6 我需要动态访问不同的项目并将它们设置为空 itemNum 是我需要访问的特定项目 我正在尝试使用 eval 函数 var itemNu

  • 如何在 Javascript 中将字符串数组转换为特定的树结构

    我从后端获取文件路径列表 它代表文件夹结构 如下所示 paths path to file1 doc path to file2 doc foo bar doc 路径的长度是任意的 为了使用文件树组件 角度2树组件 https github

  • JS中如何过滤多个字符串？ [复制]

    这个问题在这里已经有答案了 我希望能够过滤数组中的多个字符串 类型 例如我想过滤类型meat并输入fruit在下面的数据结构中 我想要实现的是过滤数据对象 const data type meat food hamburger type f

  • JavaScript 右移负数

    这是片段 var i 101 console log 101 i toString 2 console log 101 gt gt 1 i gt gt 1 toString 2 var l 101 console log 101 l toS

  • 垃圾收集器不适用于 NodeJS / Chrome 中的类型化数组

    我最初将其记录为原项目中的一个问题 https github com nodejs help issues 3590 它立即转移到帮助主题 没有很好的解释 所以现在我想在这里提问 如果我们在 NodeJS v14 v16 v17 中运行以下

随机推荐

  • 如何在 Bash 中重复一个字符？

    我怎样才能做到这一点echo perl E say x 100 您可以使用 printf 0s 1 100 这是如何运作的 Bash 扩展 1 100 所以命令变成 printf 0s 1 2 3 4 100 我已将 printf 的格式设

  • 如何使用 socket.io 将所有客户端重定向到另一个页面？

    我正在开发一款在线多人卡牌反人类游戏 React 在前面 React 路由器用于重定向 Node 在后面 当大厅中的一个用户时 我试图重定向 大厅 或房间中的所有客户端单击 开始 但现在只有单击开始的用户被重定向 这个想法是有人会设置一个新

  • 如何使用 scipy.spatial.Delaunay 将所有点包含到无错误三角网格中？

    我正在测试scipy spatial Delaunay并且无法解决两个问题 网格有错误 网格不包含所有点 代码和绘图图像 import numpy as np from scipy spatial import Delaunay delau

  • rsync 传输后删除发送端的文件

    我想从远程机器下载大量数据 我希望每次文件下载完成时都会删除远程计算机上的数据 我怎么做 rsync 是否有一个标志来执行此操作 您需要通过 remove source files的选项rsync命令 它说rsync从发送端删除属于传输一部

  • 如何配置 Jetty 在类更改时重新加载 WebAppContext

    我正在开发一个Web应用程序 当我在Eclipse下开发时 我运行Jetty作为开发和测试环境 当我对 Java 类进行更改时 Eclipse 会自动将它们编译到构建目录 但 Jetty 在我停止并启动服务器之前不会看到更改 我知道 Jet

  • Ant需要tools.jar但找不到它

    我正在为 Java 程序构建一个开发环境 在第一次尝试 Ant 构建脚本后 我收到了以下错误 Unable to locate tools jar Expected to find it in usr lib jvm java 6 open

  • 如何从 Rust 的 Cargo 中的集成测试访问二进制文件的函数

    在我的货运项目中 我定义了两个二进制目标 如何从集成测试访问二进制文件中定义的函数 package name passman version 0 1 0 edition 2018 bin name passmand path src dae

  • 访问 pyModbus 事务中的原始字节

    我有一个 python 脚本 可以使用 pymodbus 库处理 Modbus 事务 为了进行故障排除 我想打印发送和接收到设备的原始字节 最好以十六进制格式 这是简化的代码 请参阅底部的注释以获取我想要得到的示例 我使用了 TCP 客户端

  • gcc 4.3.4 支持 unique_ptr 吗？

    我一直在尝试在本地 CygWin 安装上使用 g 编译器来实现 PIMPL 并且我开始认为这可能是我正在运行 g 4 3 4 的事实 因为它的 C 11 支持少于完美的 使用非常基线的代码 来自 MSDNhere http msdn mic

  • Sharepoint：更新内容类型时，基于内容类型的列表会发生什么情况？

    我有一个假设性问题 至少现在是这样 假设我根据某些自定义内容类型创建列表 我将大约 1000 个项目添加到该列表中 正在生产中 然后客户来了 他说他需要修改该自定义内容类型 如果我修改自定义内容类型 列表会发生什么情况 它会自动更新吗 我怀

  • 避免数据框中的 KeyError

    我正在使用下面的代码验证我的数据框 df df df name issuer id service area id notnull all axis 1 df plan year notnull df plan year astype st

  • 当变量为 None 时，Django 设置默认模板标签输出？

    我正在寻找 django 设置或编程方式 使所有 django 模板标签在值为 None 时显示空字符串 例如 假设我有一些 django 模板 cat chases mouse 如果 cat 和 mouse 都为 None 它将呈现为 N

  • Bool 属性无法在 swift 中标记为动态

    我正在尝试观察Bool使用 KVO 并添加 swift 中的值dynamic像这样的修改器 dynamic var isRestricted Bool 编译器说 属性无法标记为动态 因为其类型无法在 Objective C 中表示 那我该怎

  • 如何使用自动装配的 Spring Boot 监听多个队列？

    我是 Spring Boot 的新手 正在尝试它 目前我已经构建了一些应用程序 我希望能够通过队列相互通信 我目前有一个侦听器对象 可以从特定队列接收消息 Configuration public class Listener final

  • 最新R版本的dplyr汇总功能问题

    在我之前的 R 版本中从未发生过以下情况 mtcars gt dplyr group by carb gt dplyr summarise N sum am 1 Error in summarise impl data dots envir

  • 域组的 Windows 身份验证到 Oracle

    我知道可以使用 操作系统身份验证 来对 Oracle 数据库中的 Windows 用户进行身份验证 该过程基本上是将当前 Windows 用户 ID 传递给 Oracle 进行身份验证 问题是 是否可以在 Oracle 中对域组进行身份验证

  • WKWebView 和 NSURLProtocol 不起作用

    使用旧的 UIWebView 时 您可以通过实现自定义 NSURLProtocol 来捕获请求 我用它来处理需要身份验证的请求 我尝试了相同的代码 它不适用于新的 WKWebView 但我的协议类根本没有被调用 有人遇到同样的问题还是有更好

  • Tkinter filedialog.askdirectory() 找不到外部驱动器

    I have made some folder synchronization program in the last week that I wanted to primarily deploy to have an easy way t

  • Common Lisp 中的未绑定变量

    我是 Lisp 新手 正在阅读 ANSI Common Lisp 第 8 章中的文本生成器示例 我按照该示例并在 LET 变量 prec 的范围内定义了一个函数 see let prec defun see symb let pair as

  • JavaScript 中音频的波形可视化[重复]

    这个问题在这里已经有答案了 我正在尝试使用 JavaScript 显示音频文件的波形 但我什至不知道如何开始 我找到了音频数据API https wiki mozilla org Audio Data API Working Audio D

热门标签