JavaScript

語言：

JaveScriptBabelCoffeeScript

確定

(function() {

var playBtn = document.getElementById('playBtn');

var myAudio = new Muvis("/uploads/160601/Find_My_Way_Home.mp3", {

dataMax: 50,

onLoad: function() {

playBtn.onclick = function(e) {

if (!myAudio.isPlaying) {

myAudio.play();

this.className = 'stop';

} else {

myAudio.stop();

this.className = '';

}

}

},

onData: function(data) {

var maxHeight = (Math.max.apply(null, data) / 255) * 90;

d3.select('#bars')

.style('height', maxHeight + '%')

.selectAll('div')

.data(data)

.style('height', function(h) {

return ((h / 255) * 100) + '%';

})

.enter().append('div')

},

onEnded: function() {

playBtn.className = '';

}

});

})();

總結(jié)

以上是生活随笔為你收集整理的html5音频文件生成波形图代码,HTML5/D3.js 可视音频波形柱状图的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。