如何实施浪潮冲浪者设计？请指教。我已经实现了以下代码，但不满足我的要求。我的要求是在图片Waveform下。我需要像热浪一样创造。请提供样品或代码以获取我的要求要求：1：https://i.stack.imgur.com/Ps8ZU.jpg我的输出：Current OutPut
`<head>
<script src=""wavesurfer.js""></script>
<script src=""wavesurfer.regions.js""></script>
<script src=""wavesurfer.spectrogram.js""></script>
</head>
<body>
<div id=""waveform""></div>
<div id=""spectrogm""></div>
<script>
try{
var wavesurfer = WaveSurfer.create({
container: '#waveform',
waveColor: 'violet',
progressColor: 'purple',
plugins: [
WaveSurfer.spectrogram.create({
wavesurfer: wavesurfer,
container: '#spectrogm'
})
]
});
var wavesurfer2 = WaveSurfer.create({
container: '#waveform2',
waveColor: 'Black',
progressColor: 'Black'
});
}
catch(err)
{
}
function readTextFile(file)
{
try
{
var blob = null;
var rawFile = new XMLHttpRequest();
rawFile.open(""GET"", file);
rawFile.responseType = ""blob"";//force the HTTP response, response-type header to be blob
rawFile.onload = function()
{
blob = rawFile.response;//xhr.response is now a blob object
wavesurfer.loadBlob(blob);
wavesurfer2.loadBlob(blob);
}
rawFile.send();
}
catch(err)
{
}
}
//file:///storage/emulated/0/new/rooster.wav'
readTextFile('file://" + AudioSource + @"');
function playAudio()
{
wavesurfer.play();
}
function pauseAudio()
{
wavesurfer.pause();
}
</script>
</body>
</html>";`