zoomTo removes event listeners

Hi,
I've noticed that, in React Diagram component, after I call diagramInstance.zoomTo two or more times, it removes all the symbols annotations eventListeners that I've previously set.
Do you have any solution to prevent that?

Thank you.

5 Replies 1 reply marked as answer

GG Gowtham Gunashekar Syncfusion Team February 24, 2021 02:43 PM UTC

Hi Alex, 
 
There is no possibility to remove the event Listeners when call the “zoomTo” API. We request you to share us more details about your issue like sample to replicate the issue with replication procedure  or video demonstration of the reported issue. That will help us to serve you better. 
 
Regards, 
Gowtham,    




AP Alex Pla Alonso February 24, 2021 04:19 PM UTC

Hi Gowtham,
I wasn't asking to remove the eventListeners when I zoomTo, I was saying that the diagram does this automatically (not our code) after two or three zoom ins, and I imagine that's a bug by your side (of the Diagram component).
I attach a video of this behavior, with chrome's code inspector open where you can see that I point the element, it's event listener and where is it located in the app.
Prior to zooming in, it does have the event listener.
After two or three zoom ins (where we only call diagram.zoomTo, we don't do anything else there nor update anything), you can see that the eventListener attached to that html node disappears, so when you click that annotation it's not working anymore (until you refresh the page, of course).

I hope that now it's clear enough.
Thanks in advance,


Alex P.

Attachment: zoomIn_removes_eventListeners_10b165c2.7z


GG Gowtham Gunashekar Syncfusion Team February 25, 2021 02:17 PM UTC

Hi Alex, 
 
We have added a sample link and video link and in the sample we have added an event listener to the html element and called the “zoomTo” for multiple times, but added event listener not removed. We cannot able to replicate the reported issue, we request you to modify the sample to replicate the reported issue that will be help us to serve you better. 
 
 
Regards, 
Gowtham. 



AP Alex Pla Alonso February 25, 2021 03:29 PM UTC

Hi Gowtham,
Thanks for your reply. I see your example, and we're doing it the same way, but somehow, in some of the diagrams, if nodes disappear from the view (for example, we zoom in enough for them to get out of the viewport, or we drag the diagram so the node gets out of the viewport), they also disappear from the DOM, and when I zoom out or move the diagram panel again so they get "visible" they appear in the DOM again.
I imagine there's some config in the Diagram component that if some props are passed, the dom is not always loaded for all the diagram, and it generates it depending on the visible content of the diagram, am I right?
In that case, do you know how can I turn that off so the whole diagram (not only the part which is visible in the viewport in that specific moment) is always appearing on the DOM? That way, if I set a eventListener it will happen as your example and the eventListener won't disappear (actually now we know that what disappears and reappears is the node, so when it appears again it does not have the eventListener attached, which makes sense since it's a "new" HTML node).

I've already googled it but couldn't find the answer in your Documentation.


Thanks again, hope I've made myself clear and we can figure out what of our config is causing that.


NG Naganathan Ganesh Babu Syncfusion Team February 26, 2021 01:41 PM UTC

  
Hi Alex, 
 
Sorry for the inconvenienced. 
 
On further analysis your requirement, you have hooked the text element events in your project and it will affect while re-rendering the diagram. By default, we have re-rendered the diagram and its nodes once the point of zoom value in diagram. On that time, the text element and hooked event will be removed. So, there is no possible to achieve your requirement once zooming the diagram.  
 
Regards, 
 
Naganathan K G 


Marked as answer
Loader.
Up arrow icon