Need to know how to capture the location of the cursor when using the cursor plugin.
NOTE: This isn't an issue like a bug but rather I am trying to figure out how to use values from the JS to create a separate canvas(s) to make my own markers above. I do not know where else to ask. Apologies if this is not where I need to ask these things.
Current version of hosted plugin. Brave and Chrome and windows 10 and 8.1
Code using is the Main plugin wavesurfer.js, and plugins timeline, cursor
There is no issue other than I am trying to capture the cursor location. Basically what I am trying to do is take the same area that the waveform is in and capture the location of the cursor to place points in a separate container above the waveform to create my own markers in a separate container. (Not ranges) I have been working on this for a few days and its hard because the plugins are in minified format. Also I have to figure out how they are handling more than one container to allow scrolling. Any info would be greatly appreciated. Thanks.
Just an FYI for others attempting to do similar.
I have found the value I needed to place a box just above the cursor .
wavesurfer.params.pixelRatio
Use this for the X value and it will be the same location of the cursor even if you zoom.
I am still working on this and will update here on things I find. Perhaps the author(s) can then later make a new plugin or similar to allow this to be integrated.
Thanks again.
Next I am going to try to figure out how to retain position when zooming in or out.
Ok I am not sure why but the value I am using does not work in Chrome.
I have been working on this for a few days and its hard because the plugins are in minified format.
Why not use the un-minified?
After spending a lot of time in the code. I realize that what I need is to be able to create a duplicate container without the waveform. Then assign my own drawings in this new container matching the play location. The code uses a function/class to produce the "container" that has the canvas to produce a 2D drawing background for the graphics. I just need to tap into that and generate what I need.
Would be great to have a roadmap for plugin development. Any other information that could help me would be appreciated. I really like this and would like to make something great. Just not as good as others at JS. (still learning)
I have been trying to get the 2 canvases linked so when you zoom in/out they any created elements in the 2nd one will match the 1s one that has the waveform in it. I am not having any luck figuring out how to do that. The 2nd canvas does not even create new