jberg/butterchurn

# Butterchurn Butterchurn 是 Milkdrop 可视化工具的 WebGL 实现。 ## [立即体验](https://butterchurnviz.com) [](https://butterchurnviz.com) ## 用法 ### 安装 在安装了 [pnpm](https://pnpm.io/)、[yarn](https://yarnpkg.com/) 或 [npm](https://npmjs.org/) 的情况下，运行 ``` $ pnpm add butterchurn butterchurn-presets or $ yarn add butterchurn butterchurn-presets or $ npm install butterchurn butterchurn-presets ``` ### 创建可视化工具 ``` import butterchurn from 'butterchurn'; import butterchurnPresets from 'butterchurn-presets'; // initialize audioContext and get canvas const visualizer = butterchurn.createVisualizer(audioContext, canvas, { width: 800, height: 600 }); // get audioNode from audio source or microphone visualizer.connectAudio(audioNode); // load a preset const presets = butterchurnPresets.getPresets(); const preset = presets['Flexi, martin + geiss - dedicated to the sherwin maxawow']; visualizer.loadPreset(preset, 0.0); // 2nd argument is the number of seconds to blend presets // resize visualizer visualizer.setRendererSize(1600, 1200); // render a frame visualizer.render(); ``` ### 浏览器支持 Butterchurn 需要[浏览器支持 WebGL 2](https://caniuse.com/#feat=webgl2)。 你可以使用我们最小化的 isSupported 脚本来测试是否支持： ``` import isButterchurnSupported from "butterchurn/lib/isSupported.min"; if (isButterchurnSupported()) { // Load and use butterchurn } ``` ## 集成 * [Webamp](https://github.com/captbaritone/webamp)，由 [captbaritone](https://github.com/captbaritone) 开发的，使用 HTML5 和 Javascript 对 Winamp 2.9 的出色重制版 * [Butterchurn Extension](https://chrome.google.com/webstore/detail/butterchurn-music-visuali/jfdmelgfepjcmlljpdeajbiiibkehnih)，使用 Butterchurn 可视化任何页面的音频 * [Rekt Networks](https://nightride.fm/#Mathdrop)，由 [Zei](https://twitter.com/TheRektNetwork) 开发的直播 DJ、归档和独家发布平台 * [mStream](http://mstream.io/)，由 [IrosTheBeggar](https://github.com/IrosTheBeggar) 开发的个人音乐流媒体服务器 * [pasteur](https://www.pasteur.cc/)，由 [markneub](https://github.com/markneub) 开发的根据你的音乐生成迷幻视频的工具 * [ChromeAudioVisualizerExtension](https://chrome.google.com/webstore/detail/audiovisualizer/bojhikphaecldnbdekplmadjkflgbkfh)，由 [afreakk](https://github.com/afreakk) 开发的工具，放点音乐，把你的浏览过程变成一场派对！ * [Karaoke Forever](https://www.karaoke-forever.com)，由 [bhj](https://github.com/bhj) 开发的开放式卡拉 OK 派对系统 * [Syqel](https://syqel.com/)，全球最佳的 AI 驱动音乐可视化工具 ## 致谢 * [Ryan Geiss](http://www.geisswerks.com/) 创建了 [MilkDrop](http://www.geisswerks.com/about_milkdrop.html) * Nullsoft 创建了 [Winamp](http://www.winamp.com/) * 所有出色的 preset 创作者，特别感谢 [Flexi](https://twitter.com/Flexi23) ## 许可证 本项目基于 MIT 许可证授权 - 有关详细信息，请参阅 [LICENSE](LICENSE) 文件

标签：CMS安全, JavaScript, WebGL, Web前端, 多媒体, 数据可视化, 自定义脚本, 音频可视化