Detecting double click events on segmentation labels (javascript)

[dvanselow]

I'm working on an ontology traverser for a brain atlas, and I'm keen on tracking the segmentation labels users interact with so I can update the ontology display in real time.

Currently, I'm employing the following approach to toggle labels based on user selections from the ontology window and pushing a new state to NG:

temp_state = viewer.state.toJSON();
temp_state['layers'][10]['segments'] = ['16429','18022'];
viewer.state.restoreState(temp_state);

This method could work to update my ontology state, but it's a bit cumbersome because I have to constantly poll the viewer state using viewer.state.toJSON() and then parse the results to discern which labels are currently active.

Is there a more streamlined way to achieve this? Specifically, I'm wondering if there's a way to attach an event listener (or an equivalent mechanism) to Neuroglancer to notify my application when a user selects a segmentation label. This would eliminate the need for constant polling and make the entire process more efficient.

Any guidance on this would be greatly appreciated. Thank you in advance!

[jbms]

Everything in Neuroglancer is event driven and you can monitor the state in many different ways.

For example you can use

viewer.state.changed.add(() => { console.log("state changed"); });

That will be called very frequently so you may want to throttle your callback, e.g. using lodash/throttle.

It is also possible to monitor just changes to the set of visible segments for the second layer:

viewer.layerManager.managedLayers[1].layer.displayState.segmentationGroupState.value.visibleSegments.changed.add(() => {"segments changed");});

However, while the second approach is more targeted and will fire more selectively, various UI actions, etc. may lead to some of those objects becoming invalidated such that your callback is no longer invoked, and it is also more likely to be affected by future code changes.

Therefore the first approach of just registering a general event handler may be better if sufficient for your needs.

[dvanselow]

Oh wow that really opens up a lot of avenues! So helpful!!!

As a follow-up, is there a way to capture the segment that the cursor is hovering over? As far as I can tell, that information is not stored in the viewer state.

[jbms]

Higher level approach:

x = viewer.layerSelectedValues
x.changed.add(() => console.log(x.toJSON()))

Lower-level approach:

s = viewer.layerManager.managedLayers[1].layer.displayState.segmentSelectionState;
s.changed.add(() => console.log(s.value))

[dvanselow]

Thank you for all your help!!! Both of these suggestions worked wonderfully.

…

On Mon, Aug 28, 2023 at 12:34 AM Jeremy Maitin-Shepard < ***@***.***> wrote: Closed #484 <#484> as completed. — Reply to this email directly, view it on GitHub <#484 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACR2TNHD2P55AGOKMDQUIK3XXQNVPANCNFSM6AAAAAA33446UM> . You are receiving this because you authored the thread.Message ID: ***@***.***>