是否可以在 Processing.JS 中生成正弦音？答案

【问题标题】：Is it possible to generate sine tones in Processing.JS?是否可以在 Processing.JS 中生成正弦音？
【发布时间】：2018-10-15 09:38:41
【问题描述】：

我是一名业余音乐家，我向几乎没有接受过音乐教育的学童教授音乐基础知识。

我已将a small app in Processing.JS 编码为一个圆圈，它显示了西方音阶的 12 个音符（A、A#、B、C、C#、D、D#、E、F、F#、G、G#），以及突出它们之间的关系，从中构建音阶/音程。

我希望能够触摸特定的音符名称并生成与该音符相关的正弦音（非常明显的是 A = ...、220Hz、440Hz、880Hz、...）

所以要分解它，在 Processing.JS 中，是否可以在检测到鼠标事件时生成所需频率的正弦音？如果有人可以帮我解决这个问题，我可以解决剩下的问题。

明确一点：我不太擅长 Javascript，而且我的处理能力也适中。我知道 Javascript 可以做这样的事情，但我不知道如何在这个 webapp 中集成这两种语言。

【问题讨论】：

我猜你可以使用 Web Audio API ...或者类似 Tone.js 的东西
@EJTH 你能告诉我怎么做吗？我不知道如何集成 Javascript 和 Processing.JS，因为我对 Javascript 没有太多经验。
一般你使用
@Boloar 查看this article，了解如何将 ProcessingJS 与 JavaScript 集成以使用其他声音库。或者，您可以将处理语法移植到 P5.js（非常相似）并使用它的 p5.sound 库

标签： javascript processing processing.js

【解决方案1】：

正如您所暗示的，您将不得不在 JavaScript 中执行此操作。 George 的评论很到位：您应该从阅读this page 开始。

但基本上，要记住的是 Processing.js 被转换为 JavaScript，因此您可以直接从 Processing.js 调用 JavaScript 代码。

我会首先在谷歌上搜索“JavaScript 正弦音”之类的内容，以获得大量结果。 Tone.js 似乎是一个做你想做的图书馆，但我相信还有很多其他的。

要使用 Tone.js 库，您需要首先将其导入 HTML，这正是您已经导入 Processing.js 库的方式：

<script src="https://cdnjs.cloudflare.com/ajax/libs/tone/13.3.10/Tone.js"></script>

然后您可以在 Processing.js 代码中使用 Tone.js：

var synth ;

void setup(){
  //create a synth and connect it to the master output (your speakers)
  synth = new Tone.Synth().toMaster();
}

void mousePressed(){
  //play a middle 'C' for the duration of an 8th note
  synth.triggerAttackRelease('C4', '8n')
}

void draw(){}

请注意，Processing.js 在进行转换时会单独留下 JavaScript 代码，因此您的最终输出只是一堆 JavaScript 代码。这就是为什么你可以像这样混合使用 JavaScript 代码和 Processing.js 代码。

但也正如 George 所说，您可能应该考虑切换到 P5.js，因为不再维护 Processing.js。

无耻的自吹自擂：here是Processing.js的教程，here是P5.js的一些教程。

【讨论】：