john-guerra / navio

A d3 visualization widget to help summarizing, exploring and navigating large network visualizations
https://navio.dev
MIT License
106 stars 13 forks source link

Issue in angular 7 #35

Open gcardozoj opened 4 years ago

gcardozoj commented 4 years ago

Hi, I'm trying to use navio on an Angular app with d3. I show the data in the component but when I try to sort the data (click on a header) I get this error on the console:

core.js:9110 ERROR TypeError: Cannot read property 'sourceEvent' of null at SVGGElement.<anonymous> (navio.min.js:2) at Dispatch.apply (dispatch.js:61) at customEvent (on.js:103) at Emitter.emit (brush.js:286) at Emitter.brush (brush.js:278) at SVGGElement.<anonymous> (brush.js:222) at Selection.each (each.js:5) at brush.move (brush.js:212) at Selection.call (call.js:4) at J (navio.min.js:2)

When I try to select a range, the error is:

core.js:9110 ERROR TypeError: Cannot read property 'touches' of null at SVGGElement.started (brush.js:291) at SVGGElement.<anonymous> (on.js:27) at ZoneDelegate.invokeTask (zone-evergreen.js:391) at Object.onInvokeTask (core.js:34182) at ZoneDelegate.invokeTask (zone-evergreen.js:390) at Zone.runTask (zone-evergreen.js:168) at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:465) at invokeTask (zone-evergreen.js:1603) at SVGGElement.globalZoneAwareCallback (zone-evergreen.js:1629)

Any hint about how I can solve those errors. Thanks

john-guerra commented 4 years ago

You also get into all sort of issues when embedding in React. I think it is an issue with the way d3 gets bundled with react or angular. The issue is that the d3.event doesn't get binded properly

I have tried many things but nothing seems to work

john-guerra commented 4 years ago

There are chances that this can improve with d3@6, because it uses different event handling