Sync videojs-wavesurfer with SpectrogramPlugin and waveform

[Iquebal]

Hi,

I want to sync with three thing together. Sync videojs-wavesurfer with SpectrogramPlugin and waveform
I am not able to sync three things together. I am able to sync audio and video together but Spectrogram not able to bind three things. Please help me ASAP.
Here is the example two things bind together videojs and wavesurffer. I also want to bind Spectrogram. Three things in Sync.
https://collab-project.github.io/videojs-wavesurfer/demo/video.html

--
Thanks,
Iquebal

[thijstriemstra]

@Iquebal take a look at this example: https://github.com/collab-project/videojs-wavesurfer/blob/master/examples/plugin.html

And mix it with the video example. What code do you have so far?

[Iquebal]

Hi,
I also want to bind Spectrogram.

thanks

[thijstriemstra]

I also want to bind Spectrogram.

What does that mean? videojs-wavesurfer should add a spectrogram below the player when you enable the plugin, like this: https://wavesurfer-js.org/plugins/spectrogram.html

[mayurshinde4590]

Hi thijstriemstra ,
i am also working with iquebal we stucked in below problem.
we need help in binding videojs and wavesurefer.js and spectogram,

example :- when i play video both spectogram and wavesurfer should play,and when i pause video all should pause.meanse all should in sync
please help us above problem .
thanks & regards
Mayur

[mayurshinde4590]

How we can add spectogram in below code can you please help use.

plugins: [
// timeline
WaveSurfer.timeline.create({
container: '#wave-timeline'
}),
// regions
WaveSurfer.regions.create({
regions: [
{
start: 1.123,
end: 5,
color: 'rgba(255, 255, 205, 0.7)',
drag: false
}, {
start: 6.5,
end: 8,
color: 'rgba(205, 255, 255, 0.6)',
drag: false
}
]
})
]

[thijstriemstra]

See https://github.com/katspaugh/wavesurfer.js/tree/master/example/spectrogram and https://github.com/collab-project/videojs-wavesurfer/blob/master/examples/plugin.html

Use

WaveSurfer.spectrogram.create({
                container: '#wave-spectrogram',
                labels: true
            })

[mayurshinde4590]

Thanks for your reply,

but it seems not working in aur code can you please check below code that we have written and find mistake that we done.

this.config = {
controls: true,
bigPlayButton: false,
autoplay: false,
fluid: false,
loop: false,
width: 600,
height: 200,
plugins:
{
// configure videojs-wavesurfer plugin
wavesurfer: {
backend: 'MediaElement',
displayMilliseconds: true,
debug: true,
waveColor: 'lightblue',
progressColor: 'darkblue',
cursorColor: 'navy',

      hideScrollbar: true,
      container: '#waveform',
     plugins:[
      WaveSurfer.spectrogram.create({
      container: '#wave-spectrogram',
      labels: true
    }),
     ],

      loaderColor: 'purple',
      barHeight: 7,
      barMinHeight: 5,
      barRadius: 5,
      forceDecode: true,
      height: 170,
      interact: true,
    
      
      minPxPerSec: 100,
     
      responsive: true,
    },

  
  },
};

}

[mayurshinde4590]

this.config = {
controls: true,
bigPlayButton: false,
autoplay: false,
fluid: false,
loop: false,
width: 600,
height: 200,
plugins:
{
// configure videojs-wavesurfer plugin
wavesurfer: {
backend: 'MediaElement',
displayMilliseconds: true,
debug: true,
waveColor: 'lightblue',
progressColor: 'darkblue',
cursorColor: 'navy',

      hideScrollbar: true,
      container: '#waveform',
     plugins:[
      WaveSurfer.spectrogram.create({
      container: '#wave-spectrogram',
      labels: true
    }),
     ],

      loaderColor: 'purple',
      barHeight: 7,
      barMinHeight: 5,
      barRadius: 5,
      forceDecode: true,
      height: 170,
      interact: true,
    
      
      minPxPerSec: 100,
     
      responsive: true,
    },

  
  },
};

}

[mayurshinde4590]

Hi thijstriemstra Sir,

actually we took help from many of aur engineers but not able to find solution ,Sir If you have time then please connect with us on hangout .

[thijstriemstra]

actually we took help from many of aur engineers but not able to find solution ,Sir If you have time then please connect with us on hangout .

i can provide paid consulting services. where can i email you?

[mayurshinde4590]

please find my email id below

[email protected]

[mayurshinde4590]

Hi Sir, Can we have call once you free. Thanks & Regards Mayur shinde

…

On Wed, Feb 17, 2021, 6:49 PM Thijs Triemstra ***@***.***> wrote: See https://github.com/katspaugh/wavesurfer.js/tree/master/example/spectrogram and https://github.com/collab-project/videojs-wavesurfer/blob/master/examples/plugin.html Use WaveSurfer.spectrogram.create({ container: '#wave-spectrogram', labels: true }) — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#127 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ANV4WFCLOH7GJG4D7CPTHMLS7O655ANCNFSM4XYGWZVQ> .

[thijstriemstra]

I sent you an email earlier today.

[mayurshinde4590]

Hi Sir I am not able to pay because my salary is very low I am fresher in company, I am not able to solve this that's why I messaged you. Thanks Mayur

…

On Thu, Feb 18, 2021, 1:15 AM Thijs Triemstra ***@***.***> wrote: I sent you an email earlier today. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#127 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ANV4WFDGRTTXCR4OWK53XBDS7QMD7ANCNFSM4XYGWZVQ> .

[Iquebal]

Hi,
Here is the code I want to Sync videojs.wavesurfer, wavesurfer, SpectrogramPlugin I am able to Sync videojs.wavesurfer, wavesurfer but not the Sync SpectrogramPlugin. Here is the code. Please review the code where I am doing little mistake. Find the screenshot for the same.

// video.js configuration
Promise.resolve(null).then(() => {
this.config = {
controls: true,
bigPlayButton: false,
autoplay: false,
fluid: false,
loop: false,
width: 600,
height: 200,
plugins:
{
// configure videojs-wavesurfer plugin
wavesurfer: {
backend: 'MediaElement',
displayMilliseconds: true,
debug: true,
waveColor: 'lightblue',
progressColor: 'darkblue',
cursorColor: 'navy',
hideScrollbar: true,
container: '#waveform',
loaderColor: 'purple',
barHeight: 7,
barMinHeight: 5,
barRadius: 5,
forceDecode: true,
height: 170,
interact: true,
// mediaControls: true,
minPxPerSec: 100,
partialRender: true,
pixelRatio: 1,
responsive: true,
scrollParent: true,
splitChannels: false,
plugins: [
SpectrogramPlugin.create({
container: '#wave-spectrogram',
fftSamples: 512,
labels: true,
colorMap: [[0, 0, 0.01568627450980392, 1], [0.00392156862745098, 0, 0.023529411764705882, 1], [0.00784313725490196, 0.00392156862745098, 0.03137254901960784, 1], [0.011764705882352941, 0.00392156862745098, 0.0392156862745098, 1], [0.011764705882352941, 0.00784313725490196, 0.047058823529411764, 1], [0.01568627450980392, 0.00784313725490196, 0.054901960784313725, 1], [0.0196078431372549, 0.011764705882352941, 0.06274509803921569, 1], [0.023529411764705882, 0.011764705882352941, 0.07058823529411765, 1], [0.027450980392156862, 0.01568627450980392, 0.0784313725490196, 1], [0.03137254901960784, 0.01568627450980392, 0.08235294117647059, 1], [0.03137254901960784, 0.0196078431372549, 0.09019607843137255, 1], [0.03529411764705882, 0.0196078431372549, 0.09803921568627451, 1], [0.0392156862745098, 0.023529411764705882, 0.10588235294117647, 1], [0.043137254901960784, 0.023529411764705882, 0.11372549019607843, 1], [0.047058823529411764, 0.027450980392156862, 0.12156862745098039, 1], [0.050980392156862744, 0.027450980392156862, 0.12941176470588237, 1], [0.054901960784313725, 0.03137254901960784, 0.13725490196078433, 1], [0.054901960784313725, 0.03137254901960784, 0.1450980392156863, 1], [0.058823529411764705, 0.03529411764705882, 0.15294117647058825, 1], [0.06274509803921569, 0.03529411764705882, 0.1607843137254902, 1], [0.06666666666666667, 0.0392156862745098, 0.16862745098039217, 1], [0.07058823529411765, 0.0392156862745098, 0.17647058823529413, 1], [0.07450980392156863, 0.043137254901960784, 0.1843137254901961, 1], [0.0784313725490196, 0.043137254901960784, 0.19215686274509805, 1], [0.0784313725490196, 0.047058823529411764, 0.2, 1], [0.08235294117647059, 0.047058823529411764, 0.20392156862745098, 1], [0.08627450980392157, 0.050980392156862744, 0.21176470588235294, 1], [0.09019607843137255, 0.050980392156862744, 0.2196078431372549, 1], [0.09411764705882353, 0.054901960784313725, 0.22745098039215686, 1], [0.09803921568627451, 0.054901960784313725, 0.23529411764705882, 1], [0.09803921568627451, 0.058823529411764705, 0.24313725490196078, 1], [0.10196078431372549, 0.058823529411764705, 0.25098039215686274, 1], [0.10588235294117647, 0.06274509803921569, 0.25882352941176473, 1], [0.10980392156862745, 0.06274509803921569, 0.26666666666666666, 1], [0.11764705882352941, 0.06274509803921569, 0.27450980392156865, 1], [0.12156862745098039, 0.06274509803921569, 0.2823529411764706, 1], [0.12941176470588237, 0.06274509803921569, 0.28627450980392155, 1], [0.13725490196078433, 0.06274509803921569, 0.29411764705882354, 1], [0.1411764705882353, 0.06274509803921569, 0.30196078431372547, 1], [0.14901960784313725, 0.06274509803921569, 0.30980392156862746, 1], [0.1568627450980392, 0.06274509803921569, 0.3137254901960784, 1], [0.1607843137254902, 0.06666666666666667, 0.3215686274509804, 1], [0.16862745098039217, 0.06666666666666667, 0.32941176470588235, 1], [0.17254901960784313, 0.06666666666666667, 0.33725490196078434, 1], [0.1803921568627451, 0.06666666666666667, 0.34509803921568627, 1], [0.18823529411764706, 0.06666666666666667, 0.34901960784313724, 1], [0.19215686274509805, 0.06666666666666667, 0.3568627450980392, 1], [0.2, 0.06666666666666667, 0.36470588235294116, 1], [0.20784313725490197, 0.06666666666666667, 0.37254901960784315, 1], [0.21176470588235294, 0.06666666666666667, 0.3764705882352941, 1], [0.2196078431372549, 0.06666666666666667, 0.3843137254901961, 1], [0.22745098039215686, 0.06666666666666667, 0.39215686274509803, 1], [0.23137254901960785, 0.06666666666666667, 0.4, 1], [0.23921568627450981, 0.06666666666666667, 0.403921568627451, 1], [0.24705882352941178, 0.06666666666666667, 0.4117647058823529, 1], [0.25098039215686274, 0.06666666666666667, 0.4196078431372549, 1], [0.25882352941176473, 0.06666666666666667, 0.42745098039215684, 1], [0.2627450980392157, 0.07058823529411765, 0.43529411764705883, 1], [0.27058823529411763, 0.07058823529411765, 0.4392156862745098, 1], [0.2784313725490196, 0.07058823529411765, 0.4470588235294118, 1], [0.2823529411764706, 0.07058823529411765, 0.4549019607843137, 1], [0.2901960784313726, 0.07058823529411765, 0.4627450980392157, 1], [0.2980392156862745, 0.07058823529411765, 0.4666666666666667, 1], [0.30196078431372547, 0.07058823529411765, 0.4745098039215686, 1], [0.30980392156862746, 0.07058823529411765, 0.4823529411764706, 1], [0.3176470588235294, 0.07450980392156863, 0.4823529411764706, 1], [0.3215686274509804, 0.07450980392156863, 0.4823529411764706, 1], [0.32941176470588235, 0.0784313725490196, 0.48627450980392156, 1], [0.3333333333333333, 0.0784313725490196, 0.48627450980392156, 1], [0.3411764705882353, 0.08235294117647059, 0.48627450980392156, 1], [0.34509803921568627, 0.08235294117647059, 0.48627450980392156, 1], [0.35294117647058826, 0.08627450980392157, 0.48627450980392156, 1], [0.3568627450980392, 0.09019607843137255, 0.48627450980392156, 1], [0.36470588235294116, 0.09019607843137255, 0.49019607843137253, 1], [0.3686274509803922, 0.09411764705882353, 0.49019607843137253, 1], [0.3764705882352941, 0.09411764705882353, 0.49019607843137253, 1], [0.3803921568627451, 0.09803921568627451, 0.49019607843137253, 1], [0.38823529411764707, 0.09803921568627451, 0.49019607843137253, 1], [0.39215686274509803, 0.10196078431372549, 0.49411764705882355, 1], [0.4, 0.10588235294117647, 0.49411764705882355, 1], [0.403921568627451, 0.10588235294117647, 0.49411764705882355, 1], [0.4117647058823529, 0.10980392156862745, 0.49411764705882355, 1], [0.41568627450980394, 0.10980392156862745, 0.49411764705882355, 1], [0.4235294117647059, 0.11372549019607843, 0.49411764705882355, 1], [0.42745098039215684, 0.11764705882352941, 0.4980392156862745, 1], [0.43529411764705883, 0.11764705882352941, 0.4980392156862745, 1], [0.4392156862745098, 0.12156862745098039, 0.4980392156862745, 1], [0.4470588235294118, 0.12156862745098039, 0.4980392156862745, 1], [0.45098039215686275, 0.12549019607843137, 0.4980392156862745, 1], [0.4588235294117647, 0.12549019607843137, 0.5019607843137255, 1], [0.4627450980392157, 0.12941176470588237, 0.5019607843137255, 1], [0.47058823529411764, 0.13333333333333333, 0.5019607843137255, 1], [0.4745098039215686, 0.13333333333333333, 0.5019607843137255, 1], [0.4823529411764706, 0.13725490196078433, 0.5019607843137255, 1], [0.48627450980392156, 0.13725490196078433, 0.5019607843137255, 1], [0.49411764705882355, 0.1411764705882353, 0.5058823529411764, 1], [0.4980392156862745, 0.1411764705882353, 0.5058823529411764, 1], [0.5058823529411764, 0.1450980392156863, 0.5058823529411764, 1], [0.5137254901960784, 0.14901960784313725, 0.5058823529411764, 1], [0.5176470588235295, 0.14901960784313725, 0.5058823529411764, 1], [0.5254901960784314, 0.15294117647058825, 0.5019607843137255, 1], [0.5333333333333333, 0.15294117647058825, 0.5019607843137255, 1], [0.5372549019607843, 0.1568627450980392, 0.5019607843137255, 1], [0.5450980392156862, 0.1568627450980392, 0.5019607843137255, 1], [0.5529411764705883, 0.1607843137254902, 0.4980392156862745, 1], [0.5568627450980392, 0.1607843137254902, 0.4980392156862745, 1], [0.5647058823529412, 0.16470588235294117, 0.4980392156862745, 1], [0.5725490196078431, 0.16470588235294117, 0.4980392156862745, 1], [0.5764705882352941, 0.16862745098039217, 0.4980392156862745, 1], [0.5843137254901961, 0.17254901960784313, 0.49411764705882355, 1], [0.592156862745098, 0.17254901960784313, 0.49411764705882355, 1], [0.596078431372549, 0.17647058823529413, 0.49411764705882355, 1], [0.6039215686274509, 0.17647058823529413, 0.49411764705882355, 1], [0.611764705882353, 0.1803921568627451, 0.49019607843137253, 1], [0.6196078431372549, 0.1803921568627451, 0.49019607843137253, 1], [0.6235294117647059, 0.1843137254901961, 0.49019607843137253, 1], [0.6313725490196078, 0.1843137254901961, 0.49019607843137253, 1], [0.6392156862745098, 0.18823529411764706, 0.48627450980392156, 1], [0.6431372549019608, 0.19215686274509805, 0.48627450980392156, 1], [0.6509803921568628, 0.19215686274509805, 0.48627450980392156, 1], [0.6588235294117647, 0.19607843137254902, 0.48627450980392156, 1], [0.6627450980392157, 0.19607843137254902, 0.48627450980392156, 1], [0.6705882352941176, 0.2, 0.4823529411764706, 1], [0.6784313725490196, 0.2, 0.4823529411764706, 1], [0.6823529411764706, 0.20392156862745098, 0.4823529411764706, 1], [0.6901960784313725, 0.20392156862745098, 0.4823529411764706, 1], [0.6980392156862745, 0.20784313725490197, 0.47843137254901963, 1], [0.7019607843137254, 0.20784313725490197, 0.47843137254901963, 1], [0.7098039215686275, 0.21176470588235294, 0.47843137254901963, 1], [0.7137254901960784, 0.21568627450980393, 0.4745098039215686, 1], [0.7215686274509804, 0.2196078431372549, 0.4745098039215686, 1], [0.7254901960784313, 0.2196078431372549, 0.47058823529411764, 1], [0.7333333333333333, 0.2235294117647059, 0.4666666666666667, 1], [0.7372549019607844, 0.22745098039215686, 0.4666666666666667, 1], [0.7450980392156863, 0.23137254901960785, 0.4627450980392157, 1], [0.7490196078431373, 0.23529411764705882, 0.4588235294117647, 1], [0.7568627450980392, 0.23529411764705882, 0.4588235294117647, 1], [0.7607843137254902, 0.23921568627450981, 0.4549019607843137, 1], [0.7686274509803922, 0.24313725490196078, 0.45098039215686275, 1], [0.7725490196078432, 0.24705882352941178, 0.45098039215686275, 1], [0.7764705882352941, 0.24705882352941178, 0.4470588235294118, 1], [0.7843137254901961, 0.25098039215686274, 0.44313725490196076, 1], [0.788235294117647, 0.2549019607843137, 0.44313725490196076, 1], [0.796078431372549, 0.25882352941176473, 0.4392156862745098, 1], [0.8, 0.2627450980392157, 0.43529411764705883, 1], [0.807843137254902, 0.2627450980392157, 0.43529411764705883, 1], [0.8117647058823529, 0.26666666666666666, 0.43137254901960786, 1], [0.8196078431372549, 0.27058823529411763, 0.42745098039215684, 1], [0.8235294117647058, 0.27450980392156865, 0.42745098039215684, 1], [0.8313725490196079, 0.2784313725490196, 0.4235294117647059, 1], [0.8352941176470589, 0.2784313725490196, 0.4196078431372549, 1], [0.8392156862745098, 0.2823529411764706, 0.4196078431372549, 1], [0.8470588235294118, 0.28627450980392155, 0.41568627450980394, 1], [0.8509803921568627, 0.2901960784313726, 0.4117647058823529, 1], [0.8588235294117647, 0.2901960784313726, 0.4117647058823529, 1], [0.8627450980392157, 0.29411764705882354, 0.40784313725490196, 1], [0.8705882352941177, 0.2980392156862745, 0.403921568627451, 1], [0.8745098039215686, 0.30196078431372547, 0.403921568627451, 1], [0.8823529411764706, 0.3058823529411765, 0.4, 1], [0.8862745098039215, 0.3058823529411765, 0.396078431372549, 1], [0.8941176470588236, 0.30980392156862746, 0.396078431372549, 1], [0.8980392156862745, 0.3137254901960784, 0.39215686274509803, 1], [0.9019607843137255, 0.3215686274509804, 0.39215686274509803, 1], [0.9019607843137255, 0.32941176470588235, 0.39215686274509803, 1], [0.9058823529411765, 0.33725490196078434, 0.39215686274509803, 1], [0.9098039215686274, 0.3411764705882353, 0.39215686274509803, 1], [0.9137254901960784, 0.34901960784313724, 0.39215686274509803, 1], [0.9137254901960784, 0.3568627450980392, 0.38823529411764707, 1], [0.9176470588235294, 0.36470588235294116, 0.38823529411764707, 1], [0.9215686274509803, 0.37254901960784315, 0.38823529411764707, 1], [0.9254901960784314, 0.3803921568627451, 0.38823529411764707, 1], [0.9254901960784314, 0.3843137254901961, 0.38823529411764707, 1], [0.9294117647058824, 0.39215686274509803, 0.38823529411764707, 1], [0.9333333333333333, 0.4, 0.38823529411764707, 1], [0.9372549019607843, 0.40784313725490196, 0.38823529411764707, 1], [0.9372549019607843, 0.41568627450980394, 0.38823529411764707, 1], [0.9411764705882353, 0.4235294117647059, 0.38823529411764707, 1], [0.9450980392156862, 0.42745098039215684, 0.3843137254901961, 1], [0.9450980392156862, 0.43529411764705883, 0.3843137254901961, 1], [0.9490196078431372, 0.44313725490196076, 0.3843137254901961, 1], [0.9529411764705882, 0.45098039215686275, 0.3843137254901961, 1], [0.9568627450980393, 0.4588235294117647, 0.3843137254901961, 1], [0.9568627450980393, 0.4666666666666667, 0.3843137254901961, 1], [0.9607843137254902, 0.47058823529411764, 0.3843137254901961, 1], [0.9647058823529412, 0.47843137254901963, 0.3843137254901961, 1], [0.9686274509803922, 0.48627450980392156, 0.3843137254901961, 1], [0.9686274509803922, 0.49411764705882355, 0.3843137254901961, 1], [0.9725490196078431, 0.5019607843137255, 0.3803921568627451, 1], [0.9764705882352941, 0.5098039215686274, 0.3803921568627451, 1], [0.9803921568627451, 0.5137254901960784, 0.3803921568627451, 1], [0.9803921568627451, 0.5215686274509804, 0.3803921568627451, 1], [0.984313725490196, 0.5294117647058824, 0.3803921568627451, 1], [0.984313725490196, 0.5372549019607843, 0.3843137254901961, 1], [0.984313725490196, 0.5450980392156862, 0.38823529411764707, 1], [0.984313725490196, 0.5490196078431373, 0.39215686274509803, 1], [0.984313725490196, 0.5568627450980392, 0.4, 1], [0.984313725490196, 0.5647058823529412, 0.403921568627451, 1], [0.9882352941176471, 0.5725490196078431, 0.40784313725490196, 1], [0.9882352941176471, 0.5803921568627451, 0.4117647058823529, 1], [0.9882352941176471, 0.5843137254901961, 0.41568627450980394, 1], [0.9882352941176471, 0.592156862745098, 0.4196078431372549, 1], [0.9882352941176471, 0.6, 0.42745098039215684, 1], [0.9882352941176471, 0.6078431372549019, 0.43137254901960786, 1], [0.9882352941176471, 0.611764705882353, 0.43529411764705883, 1], [0.9882352941176471, 0.6196078431372549, 0.4392156862745098, 1], [0.9882352941176471, 0.6274509803921569, 0.44313725490196076, 1], [0.9882352941176471, 0.6352941176470588, 0.4470588235294118, 1], [0.9882352941176471, 0.6431372549019608, 0.45098039215686275, 1], [0.9921568627450981, 0.6470588235294118, 0.4588235294117647, 1], [0.9921568627450981, 0.6549019607843137, 0.4627450980392157, 1], [0.9921568627450981, 0.6627450980392157, 0.4666666666666667, 1], [0.9921568627450981, 0.6705882352941176, 0.47058823529411764, 1], [0.9921568627450981, 0.6784313725490196, 0.4745098039215686, 1], [0.9921568627450981, 0.6823529411764706, 0.47843137254901963, 1], [0.9921568627450981, 0.6901960784313725, 0.4823529411764706, 1], [0.9921568627450981, 0.6980392156862745, 0.49019607843137253, 1], [0.9921568627450981, 0.7058823529411765, 0.49411764705882355, 1], [0.9921568627450981, 0.7098039215686275, 0.4980392156862745, 1], [0.9921568627450981, 0.7176470588235294, 0.5019607843137255, 1], [0.996078431372549, 0.7254901960784313, 0.5058823529411764, 1], [0.996078431372549, 0.7333333333333333, 0.5098039215686274, 1], [0.996078431372549, 0.7411764705882353, 0.5176470588235295, 1], [0.996078431372549, 0.7450980392156863, 0.5215686274509804, 1], [0.996078431372549, 0.7529411764705882, 0.5254901960784314, 1], [0.996078431372549, 0.7607843137254902, 0.5294117647058824, 1], [0.996078431372549, 0.7686274509803922, 0.5372549019607843, 1], [0.996078431372549, 0.7764705882352941, 0.5450980392156862, 1], [0.996078431372549, 0.7843137254901961, 0.5490196078431373, 1], [0.996078431372549, 0.792156862745098, 0.5568627450980392, 1], [0.996078431372549, 0.8, 0.5647058823529412, 1], [0.996078431372549, 0.803921568627451, 0.5725490196078431, 1], [0.996078431372549, 0.8117647058823529, 0.5803921568627451, 1], [0.9921568627450981, 0.8196078431372549, 0.5843137254901961, 1], [0.9921568627450981, 0.8274509803921568, 0.592156862745098, 1], [0.9921568627450981, 0.8352941176470589, 0.6, 1], [0.9921568627450981, 0.8431372549019608, 0.6078431372549019, 1], [0.9921568627450981, 0.8509803921568627, 0.615686274509804, 1], [0.9921568627450981, 0.8588235294117647, 0.6196078431372549, 1], [0.9921568627450981, 0.8666666666666667, 0.6274509803921569, 1], [0.9921568627450981, 0.8745098039215686, 0.6352941176470588, 1], [0.9921568627450981, 0.8784313725490196, 0.6431372549019608, 1], [0.9921568627450981, 0.8862745098039215, 0.6509803921568628, 1], [0.9921568627450981, 0.8941176470588236, 0.6588235294117647, 1], [0.9921568627450981, 0.9019607843137255, 0.6627450980392157, 1], [0.9921568627450981, 0.9098039215686274, 0.6705882352941176, 1], [0.9921568627450981, 0.9176470588235294, 0.6784313725490196, 1], [0.9921568627450981, 0.9254901960784314, 0.6862745098039216, 1], [0.9921568627450981, 0.9333333333333333, 0.6941176470588235, 1], [0.9882352941176471, 0.9411764705882353, 0.6980392156862745, 1], [0.9882352941176471, 0.9490196078431372, 0.7058823529411765, 1], [0.9882352941176471, 0.9529411764705882, 0.7137254901960784, 1], [0.9882352941176471, 0.9607843137254902, 0.7215686274509804, 1], [0.9882352941176471, 0.9686274509803922, 0.7294117647058823, 1], [0.9882352941176471, 0.9764705882352941, 0.7333333333333333, 1], [0.9882352941176471, 0.984313725490196, 0.7411764705882353, 1], [0.9882352941176471, 0.9921568627450981, 0.7490196078431373, 1]]
})
]
},
},
};
this.wave = WaveSurfer.create(this.config);
this.wave.load(this.audioSrc);
});
}

[mayurshinde4590]

Hi thijstriemstr,
The issue has been resolved but the problem is on first time spectogramm is not loading and when i replay video its working properly can you please guide us .

Thanks& regards
Mayur