javascript - 用 RGB LED 制作音乐可视化器

Question

我的房子里安装了一些 LED，我想让它们随着音乐跳舞。

我的设置:

• 10 个 RGB LED 灯条(即 30 个 channel )由通过 USB 连接到 PC 的 PWM(48 步)控制。
  • LED 灯带物理上分为 4 组
• Hardware由 Node.js 控制。
• 音乐是在另一台机器上通过 Traktor 播放的。
  • Traktor 提供带有主节奏和电平的 MIDI 数据输出。
  • 我已通过 UDP 将 MIDI 数据转发到 Node 服务器。

我编写了一个库来抽象控制 LED，因此在 Node 中，我可以调用:

channel[n].set(intensity, r, g, b);

...它负责优化通过 USB 总线发送的数据。

因此，在我的 Node 服务器上，我收到了音乐节奏和电平数据，并希望将其转换为灯光秀。 Node 大约每 60 毫秒获取一次当前音频级别。数据如下所示(歌曲中间的 20 秒样本，点击查看大图):

http://josh3736.net/images/ledviz.gif

MIDI 数据的输出范围为 0..127。在本例中，速度值 42 对应的 BPM 为 128。

这个问题有多个部分可以解决:

• 最重要的是，使用这些数据控制 LED 的最佳方法是什么？
  • 理想情况下，输入数据应该影响颜色之间的动画/过渡；然而，在受到重击时，突然的变化/频闪也可能会很好。
• 我还应该将 Traktor 中的任何其他 MIDI 数据发送到 Node 吗？
• 如何让 4 个物理组中的每一个都偏向相同的颜色？

感兴趣的链接:

• How do you sync JavaScript animations with the tempo of a song, without building an “audio visualizer”?
• HTML 5 Beats ，具体来说this和 this .

Answer 1

对于制作 LED 灯带动画和可视化，我的首要建议是在 HSV 色彩空间中工作。这样您就可以独立控制调色板和强度: https://www.npmjs.com/package/color-system

使用 HSV 颜色对动画进行编码，然后在准备将它们发送到驱动器时​​将每个像素转换为 RGB。

例如，您可以将响度与 (V) 强度联系起来，将节奏与色调(即彩虹的哪一部分)联系起来 (H)。您可以使用正弦波来调制它们并制作不同的图案。

您可以从这里得到一些想法 - 这些模式看起来很复杂，但它们是根据音乐的强度和频率调制的简单正弦波模式:https://www.instagram.com/stvito_performance_group/