Which vizualization package will do this?

Hi,

I’ve used Jupyter Notebooks minimally and have done some basic plotting.

I’ve written a Python script in Jupyter which reads in the contents of a wave file and plots it.
However, I need to look for a certain signature in the audio. In order to do that I need to zoom in, but I need to zoom in at specific areas of the audio. To do that, I want to be able to see the zoomed and unzoomed views at the same time, but I don’t know how to do this with the vizualization libraries.

Additionally, I need to move (scroll) the zoomed area back and forth through the unzoomed wave file while looking for these signatures.

I’m using the attached picture as an example of what I am trying to do. The ocilloscope and signals are on the scope are not part of my project/program.

The attached picture is a picture of an oscilloscope trace with 3 different views of the same signal.
The top trace is the unzoomed signal.

The middle trace is zoom level 1. Note its position in the top trace- where the yellow is bright and bold.
I want to be able to move the bold highlight in the top trace back and forth as well as change the width of the
bright/bold part in the top trace, at the same time the middle trace will move in sync with the position of the bright/bold area in the top trace.

The bottom trace is zoom level 2. This is the highest level of zoom.
Note the pink bold section of the top trace- far left. As the pink area is moved (and lengthened/narrowed) in the top trace, the bottom trace will be updated accordingly.

Can this type of zooming & plot correlation be done with the Python visualization libraries?
If so, which libraries would you recommend for this?
Would you also provide some examples on how to do this?

This is way over my Jupyter experience but will help me significantly with my project.

I will use Ipywidgets to:

  1. Move the zoom positions through the unzoomed signal.
  2. Widen/narrow the bold section in the unzoomed signal

Ideally, showing the time (offset from the beginning of the wave file along the X axis) for all 3 signals would be very helpful too. The wave file uses sample numbers, but that can somehow be correlated to time. Although, knowing how to show the time differences for each level of zoom is beyond me.

Thanks

Those look like they would be best served by canvas-based visualization rather than svg.

I would probably consider using bokeh for this, potentially with the holoviz wrapper. There is also the jupyter_bokeh package which will help you bridge that to other things related to ipywidgets.

Otherwise, there is plotly-py, which does a lot, but if the core plotly doesn’t do a thing you need… that’s kind of it: there isn’t as much of a community/ecosystem around it, last i checked.

You’d probably want to do some significant looking at the examples for each of these, usually stored in the project’s repo, and then iterate from there.

2 Likes

I haven’t found a specific link to the Jupyter ecosystem yet, but because this was recently built in web assembly, like jupyterlite, I stumbled upon this video. Shortly after the 1 minute mark, some of those abilities look like what you describe. And looking around based on that brought up the following with Python at least:

I have the feeling what you need is already out there, or something closer than I could suggest from the typical data plotting libraries alone, if you find the right resource. It may be worth reaching out to some of these people involved to get some pointers in a better direction.

2 Likes

Thanks for that information.