CyLeaflet: Allow access to updated lat/lon of Cytoscape elements when modified by user

[emilykl]

Description

When the dashboard user repositions nodes in the CyLeaflet UI, the elements property of the underlying Dash Cytoscape component is updated to reflect the new node positions.

However, only the x and y coordinates are updated; the lat and lon values passed inside the node data retain their original values.

CyLeaflet should provide a way for the developer to access the elements with updated lat/lon values.

Steps/Code to Reproduce

Expected Results

Actual Results

Versions

dash_cytoscape==1.0.0

[emilykl]

One solution would be to add a callback which updates the elements store which is part of CyLeaflet every time the Cytoscape elements change. This does mean the API for accessing elements in CyLeaflet would be different than the API for accessing elements in Cytoscape, but it would provide access to the updated lat/lon without too many code changes.

However, this would complicate the existing method for the user to update elements by outputting to that same store — they would have to set prevent_initial_call and allow_duplicate to True since there would be two callbacks outputting to that store.

Alternatively, perhaps we could use Cytoscape event handlers to add a JS hook which updates the node data each time the nodes change.

This functionality could also be added by transforming the elements directly inside lib/src/Cytoscape.js to update the lat and lon values of each node when setting the elements property. This would be fairly straightforward, but (a) we would need to test impacts on performance, and (b) this would involve adding references to CyLeaflet in the Cytoscape component, which we may not want to do.