Как получить Waveform Musi c Player с Angular / Typescript - PullRequest
Новая
       74

Как получить Waveform Musi c Player с Angular / Typescript

0 голосов
/ 25 апреля 2020

Моя цель - настроить простой проигрыватель musi c в моем проекте angular 8, который отображает вставленные musi c в формате stati c wave, аналогично проигрывателю soundclouds:

enter image description here

Согласно моему поиску, это можно сделать с помощью:

Пиков JS: https://medium.com/better-programming/peaks-js-interact-with-audio-waveforms-b7cb5bd3939a
Амплитуда JS: https://521dimensions.com/open-source/amplitudejs/docs/configuration/
или Wavesurfer JS: https://wavesurfer-js.org/

К сожалению, ни у одного из них нет приличной документации о том, как правильно импортировать это в angular или в обычную машинопись.

Я попробовал его с Wavesurfer JS, но не смог.

component.ts: 

 import { WaveSurfer } from 'wavesurfer.js';

    export class MusicComponent {

    public wavesurfer

      constructor() {

        this.wavesurfer = WaveSurfer.create({
          container: '#waveform',
          waveColor: 'violet',
          progressColor: 'purple'
        });

        this.wavesurfer.load('./assets/img/hollywood.wav');



      }

    }

html 

 <div id="waveform"></div>

Вопросы сейчас:
1. Существуют ли другие полезные практики по реализации такого плеера с angular, которые я не нашел.
2. Есть ли способ заставить работать waveurf в Angular, или мой код неверен.

...