Plot Annotations Prototype

[scottbell]

Is your feature request related to a problem? Please describe.
It would be great if operators could annotate and tag plots.

Describe the solution you'd like
The operator should be able to marquee the plot to select some points, and then annotate and/or tag them.

Additional context
This should build upon the tagging we've implemented for Notebooks.

[scottbell]

@charlesh88 Per our discussion, I've moved the tagging/annotation editing into the inspector. I've been attempting to normalize this editing between the two plugins. I've got some user interaction questions below.
For notebooks:

• If you don’t have an entry selected, should we show all the tags/annotations associated with a notebook? If so, do we show a unique set of the tags?
• Should we always have an entry selected?
• If we do show all the tags/annotations associated, I assume we’d want to disable editing?

For plots:

• If you don’t have a tag/annotation selected (a group of white points), do we show all the tags/annotations associated with a plot? If so, do we show a unique set of the tags?
• Do we disable editing if we’re showing all the tags/annotations? Namely, do you have to select a grouping before editing of tags/annotations is allowed?
• After you select a group of points with the marquee, and you add a tag, do we close the marquee? Or do we keep it open so you can add more tags/annotations?

Thanks for the help!

[scottbell]

@akhenry I had a few questions too about the Selection API in OpenMCT. Specifically, I'm attempting to listen to selection changes in OpenMCT in the AnnotationInspector. This works great in Notebooks (and I can even send along a function to timestamp the entries), but in plots I'm getting a secondary PointerEvent after I set the selection. It's due to this selectable method adding some click events to ObjectViews. What's the right way here to override this event in plots? For the interim, I've just slapped a:

if (context?.item?.type === 'telemetry.plot.overlay') {
            return () => { };
        }

in the method, but I'd like a more elegant approach. Thank you!

[akhenry]

in plots I'm getting a secondary PointerEvent after I set the selection

What is the effect of this? Is it causing the plot to get selected instead of the annotation? Is this a case where event.stopPropagation() would help?

[scottbell]

The effect is the plot is getting selected instead of the annotations.

Adding event.stopPropagation() was my thinking too, but haven't had much success. I think the issue is the interfering event is a PointerEvent, not a MouseDownEvent. Thinking about it more, perhaps we could listen to PointerEventDown as well in MctPlot and see if that helps.

[scottbell]

This was my thinking too, but haven't had much success. I think the issue is the inteferring event is a PointerEvent, not a MouseDownEvent. Thinking about it more, perhaps we could listen to PointerEventDown as well in MctPlot and see if that helps.

Fixed it by adding a dummy onClick that just runs event.stopPropagation() - thanks for the help @akhenry!

[scottbell]

@charlesh88 @akhenry Going with these assumptions, please let me know if you disagree!

If you don’t have an entry selected, should we show all the tags/annotations associated with a notebook? If so, do we show a unique set of the tags?

No.

Should we always have an entry selected?

No.

If we do show all the tags/annotations associated, I assume we’d want to disable editing?

N/A

If you don’t have a tag/annotation selected (a group of white points), do we show all the tags/annotations associated with a plot? If so, do we show a unique set of the tags?

No.

Do we disable editing if we’re showing all the tags/annotations? Namely, do you have to select a grouping before editing of tags/annotations is allowed?

You have to select a group before editing is allowed.

After you select a group of points with the marquee, and you add a tag, do we close the marquee? Or do we keep it open so you can add more tags/annotations?

We keep the marquee to show selection.

[scottbell]

@charlesh88 Another question - what user gesture should be used to select previous annotations on a plot? Currently I'm using the Option (Alt) + Shift and a mouse click on to select a previously created annotation. This same shows the original bounding box that the user used to create the annotation:

[scottbell]

@akhenry One issue with having one tag per annotation for plots is that if a user wants to tag multiple items/annotations for a selection of points, this will mean multiple overlapping bounding boxes. I think it'd be more natural to select the existing annotation and add/edit it instead. The downside of this method is the possibility of conflicts, though I'm not sure we should design this around an edge case.

[scottbell]

@akhenry One issue with having one tag per annotation for plots is that if a user wants to tag multiple items/annotations for a selection of points, this will mean multiple overlapping bounding boxes. I think it'd be more natural to select the existing annotation and add/edit it instead. The downside of this method is the possibility of conflicts, though I'm not sure we should design this around an edge case.

Note I'm just forging ahead with multiple annotations.

[scottbell]

I've decreased the transparency to help with multiple annotation selections:

[scottbell]

An example of some of the interactions:

Screen.Recording.2022-12-07.at.3.01.53.PM.mov

[scottbell]

Note the number of tags/annotations makes the halo effect of the point stronger. Points with one tag appear fainter than with all three tags (due to the stacking of the annotations).

[scottbell]

@akhenry For v1, can we stick with tags annotations only? Introducing text means modifying search to be able to find them too (I think).

[scottbell]

@charlesh88 @rukmini-bose @akhenry Regarding searching for tags, if the user adds three "Driving" tags to a plot series, how do they distinguish between them?
E.g.:

Should clicking on the search result jump to the plot annotation selection?

[scottbell]

A screen recording of search results driving selection in the plots:

Screen.Recording.2022-12-13.at.2.08.32.PM.mov

[scottbell]

Testing instructions:

1. Make some notebook entries, and add some tags using the new inspector. Ensure they show up in search.
2. Make some plot annotations by holding down Option (alt on Linux/Windows) + Shift, then click to drag in a plot. Tag the annotation using the inspector. Ensure you can find the annotation in search and it jumps to the right location when you click on it.
3. Plot locking now requires a Shit + Click (per @charlesh88 request). Make sure that works.
4. Make some tags in an overlay plot comprising two pieces of telemetry (e.g., Sine Wave Generator 1 & Sine Wave Generator 2) and tag both series' points. Ensure the tags show up in their individual telemetry objects too. E.g., Sine Wave Generator 1 should have the same tag. Search for the tag and ensure it shows up for both Sine Wave Generators.
5. Clicking on an existing annotation on Simple, Overlay, Stacked Plot, Display Layout - Ensure no zoom, shows tags, selects the plot in inspector properties.
6. Create annotation on Simple, Overlay, Stacked Plot, Display Layout - Ensure no zoom, allows adding the tag, selects the plot in inspector properties
7. Search for a Tag and click on the result - Ensure it navigates to the plot and zooms in

Do all the above with CouchDB and Local Storage.

[scottbell]

Further optimizations:

• Switch to something like RBush where we can incrementally build the index based on the changes to the SeriesModel. Currently we're rebuilding the index every time loadingUpdated is fired.
• If the above isn't possible, at least reduce loadingUpdated events. This currently fires ~4 times per plot load.

[scottbell]

Note some issues with recent merges:
#6157

[charlesh88]

Verified partially fixed Testathon 2023-02-06: all items in testing instructions verified, except step 2. While in real-time mode and unpaused, alt-shift initially zooms the view and then allows point selection, but not only now that the plot is paused. This is very inconsistent gesturally for the user; what should be be done instead is this:

1. On mousedown, detect alt-shift being pressed.
2. Immediately pause the view, orange border, etc., AND suppress zooming, allowing point selection to happen immediately.
3. The user will then manually have to unpause the plot when they've completed annotating; this is fine.