Tone.PitchShift and Howler.js issues(Tone.PitchShift和Howler.js问题)
问题描述
我喜欢在我的(Meteor)应用程序中使用Howler.js。然而,播放速率功能导致了我不想要的音调变化(我只想延长时间,并保持音调不变)。因此,我的解决方案是对它进行音调转换,以"纠正"音调。看起来很简单,这就是为什么我选择使用https://tonejs.github.io/ 唯一的问题是,我无论如何都不能让它正常工作。在阅读了几个小时的Web Audio API、Tone.js文档和在线讨论/故障排除论坛后,我得到的最接近于潜在解决方案的解决方案是这样的(在我的应用程序呈现期间调用,以防问题与过早加载有关):
Tone.setContext(Howler.ctx); //set tone's context to the Howler.js audiocontext
var pShift = new Tone.PitchShift(3); //create the PitchShift effect, +3 semi-tones transposition
pShift.context = Howler.ctx; //set the PitchShift's context to the Howler.js audiocontext
pShift.connect(Howler.ctx.destination); //connect the PitchShift's output to the Howler's destination
Howler.masterGain.connect(pShift); //connect the Howler's master GainNode output to the PitchShift effect
//For debugging purposes:
console.log(Howler.masterGain)
console.log(pShift);
当我运行此命令时,收到以下错误消息:
来自Tracker After Flush函数的异常: Meteor.js?hash=857dafb4b9dff17e29ed8498a22ea5b1a3d6b41d:1059类型错误:无法在‘AudioNode’上执行‘CONNECT’:重载解析失败。
我还注意到,这些命令下面的console.log()命令甚至没有显示在控制台中,这非常奇怪。然而,当我删除最后一行(master ain.连接到pShift)时,它们会发生变化。
我尝试了其他几种技术,例如https://github.com/mmckegg/soundbank-pitch-shift/(它有效,但无论我将其设置为什么设置,它都可以播放音调变化的声音和非音调变化的声音), 或者简单地使用AudioBufferSourceNode.detune(我不知道如何让它与Howler.js一起工作,因为Howler只有可以公开GainNode和AudioContext的函数,不能在仍然使用Howler的情况下从那里读取输出)。如有任何帮助/线索,我们将不胜感激!
推荐答案
我认为您不需要代码段中的第三行。因为您的第一行告诉Tone.js使用howler.js已经创建的AudioContext。因此pShift.context应该等于Howler.ctx。但仔细检查可能是有意义的。
console.assert(pShift.context === Howler.ctx);
Howler.js曝光的masterGain是原生音频节点。这意味着它不能直接连接到使用Tone.js创建的节点,因为这些节点不是本地音频节点。但Tone.js提供了一个帮手来做到这一点。
Tone.connect(Howler.masterGain, pShift);
我认为您还需要在masterGain上调用disconnect()以删除所有现有连接。
以下代码段应该可以工作。
Tone.setContext(Howler.ctx);
const pShift = new Tone.PitchShift(3);
Howler.masterGain.disconnect();
Tone.connect(Howler.masterGain, pShift);
pShift.toDestination();
这篇关于Tone.PitchShift和Howler.js问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:Tone.PitchShift和Howler.js问题
基础教程推荐
- 最佳动态 JavaScript/JQuery 网格 2022-01-01
- 使用 jQuery 在悬停时交换 DIV 类 2022-01-01
- 从快速中间件中排除路由 2022-01-01
- 在 Javascript 中使用 Fetch API 上传文件并显示进度 2022-01-01
- CORS:当凭据标志为真时,无法在 Access-Control-Allow-Origin 中使用通配符 2022-01-01
- 即使每次插入第一个输入的值不同,第二个输入仍显示相同的输入值 2022-01-01
- 当木偶师打开Chrome时,不能使用Chrome扩展 2022-01-01
- 逻辑运算符 ||在 javascript 中,0 代表 Boolean false? 2022-01-01
- HTML5 画布调整为父级 2022-01-01
- 带角度的选项卡:仅使用 $http 在单击时加载选项卡 2022-01-01
