帝国cms后台使用savesufer.js生成大音频audio彩色频谱数据

    xiaoxiao2024-12-14  65

    场景描述

    在这之前使用wavesufer.js创建音频频谱的功能,如下图:

    但遇到一个比较不好的用户体验,即当音频文件没有完全下载完的情况下,频谱是显示不了的。所以就会出现如下图的一条直线:

    于是有了以下的解决方案,Wave加载的时候,可以加载pcm数据格式,于是利用wavesufer的exportPCM导出pcm数据格式,提供给前台网页进行加载即可。

    实现的最终效果如下图:

    这样前台即可以在音频没有加载完全,但频谱已经加载完了的情况下,直接渲染出这个频谱。

    最新回复(0)