The only way to use some libraries (like D3.js) with solid is to append the generated elements to the DOM using appendChild on an element obtained via ref. The problem is that apparently setting event handlers for events managed by SolidJS via delegation does not work. For example, when using D3.js to generate an SVG and adding an event handler for "click" on a child of the <svg> element, the handler code is never called. Any idea about how to tell SolidJS to stop intercepting events for elements under a SolidJS component but created directly in the DOM by other libraries?
#Native event handler for click on SVG elements appended to the DOM
quaint hound
versed belfry
quaint hound
That does not work because the element is NOT created by Solid and I can't put an oncapture:click on it.
minor harness
No, but you can put it on the parent. Since oncapture:click captures events, you'll get the actual event.target in the event object.
Whereas normal solid events will check if the currently pressed object is actually the target and then defer the event to it, but since the SVG is not managed by solid, it gets no deferred events.
quaint hound
Ah! Didn't know it worked that way.
Thank you very much.
That's even better than using addEventListener.
lost sorrel
That's even better than using addEventListener.
Could you share a D3 working example with Solid? I'm looking at this right now 🙂
quaint hound
I don't have an example at hand right now. I can setup one on github during the weekend.
lost sorrel
I don't have an example at hand right now. I can setup one on github during the ...
I don't want to take too much of your time, but that would be awesome 🙂 I managed to make ChartJS work but I look forward to use D3 as well for more complex stories 🙂