swimlane / ngx-graph

Graph visualization library for angular
https://swimlane.github.io/ngx-graph
MIT License
940 stars 288 forks source link

Panning and Zooming does not work with 8.3.0 und 8.4.0 #551

Open bonnm opened 4 months ago

bonnm commented 4 months ago

Describe the bug Panning and Zooming does not work. Graph is rendered correctly, Shape, colors, text, edges, everything fine. Even draggin single nodes does work. But panning the whole graph or zooming in/out with mouse wheel has no effect. The graph also is not centered but always drawed in the upper left corner.

To Reproduce I'm using Angular 16, with bootstrap 4.6 and d3-selection in Version 1.4. to get rid of thline rendering bug https://github.com/swimlane/ngx-graph/issues/487. Even a very simple graph with no text in nodes and simplest edges does not work. In Edge/Chrome console, there are the following messages when the graph is initially rendered and zoomed: Error: attribute height: Expected length, "-Infinity". Error: attribute transform: Expected number, "translate(NaN,NaN)". Error: attribute transform: Expected number, "…x(0.33,0,0,0.33,NaN,NaN)".

Expected behavior Panning the whole graph does move the graph and zooming in/out with mouse wheel resizes the graph.

ngx-graph version 8.3.0, 8.4.0 (8.2.* works!)

stepanekd commented 1 month ago

Same here with Angular 17 and ngx-graph 8.4.0. Any update or solution?

onavatte commented 1 month ago

Same issue after migrating from Angular 15 / ngx-graph 8.0.2 to Angular 16 / ngx-graph 8.4.0.

steveblue commented 3 weeks ago

This issue should be addressed in ngx-graph 9.0.0. We addressed some issues with loading in ngx-graph and bumped the peer dependency to Angular 18.