小编Geo*_*rby的帖子

使用Web Audio API和createMediaElement方法,您可以使用类型化数组从<audio>元素中的音频回放中获取频率数据,只要源URL是本地(不是流式传输),它就可以在大多数浏览器中使用.见Codepen:http://codepen.io/soulwire/pen/Dscga

实际代码:

var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var audioElement = new Audio('http://crossorigin.me/http://87.230.103.9:80/top100station.mp3'); // example stream

audioElement.crossOrigin = 'anonymous';
audioElement.type = 'audio/mpeg';

var analyser = audioCtx.createAnalyser();

audioElement.addEventListener('canplay', function() {
  var audioSrc = audioCtx.createMediaElementSource(audioElement);
  // Bind our analyser to the media element source.
  audioSrc.connect(analyser);
  audioSrc.connect(audioCtx.destination);
});

var frequencyData = new Uint8Array(20);

var svgHeight = ($window.innerHeight / 2) - 20;
var svgWidth = $window.innerWidth - 20;
var barPadding = '2';

function createSvg(parent, height, width) { …