Skip to content
This repository has been archived by the owner on Nov 24, 2023. It is now read-only.

Callback when hovering over annotation? #25

Open
msabramo opened this issue Mar 29, 2019 · 1 comment
Open

Callback when hovering over annotation? #25

msabramo opened this issue Mar 29, 2019 · 1 comment

Comments

@msabramo
Copy link

Hi there and thank you for an excellent project!

I am trying to create a UI where when the user hovers over a rectangular region, I want to update an image in another pane (essentially showing a processed version of the selected part of the image).

Are the "active annotation" and the annotation being hovered over one and the same?

Is there a way to specify a callback that gets called when the activate annotation (or hovered over annotation if that's something different) changes?

I see that the renderContent attribute lets me specify a function that returns a component that gets displayed as an overlay on top of the image, but my impression is that's meant to be more of a pure function with no side effects? Is there some callback where I don't have to return a component but I can have a side effect like this.setState({activateAnnotation: annotation})?

Great component! Thanks!

@msabramo
Copy link
Author

msabramo commented Apr 4, 2019

By the way, the approach of using renderContent for tracking state seems to work, but it results in a warning on the JS console...

Screen Shot 2019-04-04 at 7 52 09 AM

Warning: Cannot update during an existing state transition (such as within
`render`). Render methods should be a pure function of props and state.

console.(anonymous function)              @ index.js:1446
warningWithoutStack                       @ react-dom.development.js:520
warnAboutInvalidUpdates                   @ react-dom.development.js:19377
scheduleWorkToRoot                        @ react-dom.development.js:20748
scheduleWork                              @ react-dom.development.js:20838
enqueueSetState                           @ react-dom.development.js:11571
push...Component.setState                 @ react.development.js:336
Tamper._this.renderContent                @ Tamper.js:317
(anonymous)                               @ Annotation.js:186
render                                    @ Annotation.js:185
finishClassComponent                      @ react-dom.development.js:15276
updateClassComponent                      @ react-dom.development.js:15231
beginWork                                 @ react-dom.development.js:16221
performUnitOfWork                         @ react-dom.development.js:20241
workLoop                                  @ react-dom.development.js:20282
renderRoot                                @ react-dom.development.js:20362
performWorkOnRoot                         @ react-dom.development.js:21319
performWork                               @ react-dom.development.js:21229
performSyncWork                           @ react-dom.development.js:21203
batchedUpdates$1                          @ react-dom.development.js:21430
batchedUpdates                            @ react-dom.development.js:2247
dispatchEvent                             @ react-dom.development.js:5110

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant