anseki / leader-line

Draw a leader line in your web page.
http://anseki.github.io/leader-line/
MIT License
3.03k stars 424 forks source link

Get references to all SVG's created #360

Closed mrpsiho closed 2 years ago

mrpsiho commented 2 years ago

Hi!

Thanks for the great library! I am looking a way of having references to all SVG's created by LeaderLine instances. Maybe there is a method of getting them? My issue is related to https://github.com/anseki/leader-line/issues/341 actually. I saw its author was also looking the way to add id attribute to be able to access this DOM element later by id. So, I thought maybe the library itself holds a reference to the DOM element and I could use it? Basically, what I really need is relocate SVG's created to a different container. Like in this issue https://github.com/anseki/leader-line/issues/338 This is why I need references, ok? I cannot use the code you gave in #338 as I have many instances of LeaderLine and your code just grabs all available SVG elements.

My case is that I have 20 leader lines and 5 of them I have to relocate to element A and other 15 to element B. Actually, having parentElement or containerElement option for LeaderLine would really helped in my case.

anseki commented 2 years ago

Hi @mrpsiho, thank you for the comment. This may help you: https://github.com/anseki/leader-line/issues/250#issuecomment-883885356

mrpsiho commented 2 years ago

@anseki Hehe, that is tricky! :) I am going to try how it work for me. I have a fear it will not be reliable solution for my case as the lines I create are also quite dynamic. I often remove old ones and render new ones.

Do you consider adding an option to specify the parent element in the future?

mrpsiho commented 2 years ago

@anseki No, relocation of the SVGs does not help me. Their position are all wrong, they simply are not visible after the relocation.

anseki commented 2 years ago

That is not supported and it is deprecated, as mentioned in the past issues. If you don't understand DOM and SVG, you should not do that. You can draw lines without LeaderLine easily by using e.g. SVG if you understand those. Or, you can use another library that you like.

mrpsiho commented 2 years ago

@anseki Probably I do not understand SVG enough. However, this same question pops up again and again and you did not provide the explanation why it is deprecated/not possible to implement in the library. It would certainly help people like me.

I thought the relocating will help me with the issue of having the lines inside the scrolling element. But no, it does not help. I am aware of position() method and I use it on window resize event successfully. However I cannot use it for scroll event as the scrolling element is unknown upfront in my case.

anseki commented 2 years ago

The reasons to deprecate it were mentioned in the past issues but I don't remember that well because that is in the past. One of the reasons is the problem that you met just now. That is, changing tree may make many effect. If you want to know that, you will need to learn the DOM and SVG, etc.

Anyway, if you want to move lines to scrollable element, this may help you: https://jsfiddle.net/dgfbk10y/

mrpsiho commented 2 years ago

Oh, thanks! I think this is exactly what I need now! Many thanks!

anseki commented 2 years ago

:smile: Could you close this issue?