Graph2d zoom/pan problems

[temaivanoff]

Hi, In the new release does not work Graph2d, try to move the mouse, only the graph moves

[mojoaxel]

I can confirm this: http://visjs.org/examples/graph2d/01_basic.html

[mojoaxel]

@yotamberk This a big thing! Can you please have a look when you find the time.

[IanMarett]

Also broken in 4.20.1 but works in 4.20.0

i.e. Downgrading to 4.20.0 fixes the issue

[Matt-PMCT]

In an attempt to be helpful I've been trying to figure this out. Unfortunately I'm still not sure of the root cause of this, however if it helps at all in Core.js if you comment out lines 110 and 112 then the zoom is fixed on the 2d Graphs.
//if (this.initialDrawDone === true) { this._redraw(); //}

I believe the problem might have been introduced in 6afc095 because there were changes to the .initialDrawDone setting there, but I'm still trying to isolate this

Matt

[Matt-PMCT]

Ok I think I finally narrowed it down. It is the 6afc095 changes. All of the code from TimeLine.js Line 164 to 192 needs to be copied into Graph2d.js line 118.

I'm unfamiliar with the entire code base, so I may be missing something in the big picture, but this does fix it.

[jugantner]

Hi all,
is there a plan to release version 4.21.1 where this zoom/pan issue is fixed?
Thanks

[Archi20]

I have similar issue with autoresizing, I have dual xAxis with 3 goups. One includeed in left dataAxis and rest two in right dataAxis. The problem is that graph resizing in wrong way and it is just draw 2 lines instead of 3. Bellow i send you example of data I have used.

 `
       //yellow
        {"x":5000,"y":1,"group":"T", "id":2},
        {"x":76000,"y":1,"group":"T", "id":4},
        {"x":101000,"y":1,"group":"T", "id":6},
        {"x":127000,"y":1,"group":"T", "id":8},

        //blue
        {"x":5000,"y":4,"group":"S", "id":1},
        {"x":76000,"y":4, "group":"S", "id":3},
        {"x":101000,"y":4,"group":"S", "id":5},
        {"x":127000,"y":4,"group":"S", "id":7},

        //red
        {"x":5000,"y":9,"group":"C", "id":9},
        {"x":76000,"y":9,"group":"C", "id":10},
        {"x":101000,"y":9,"group":"C", "id":11},
        {"x":127000,"y":9,"group":"C", "id":12}
`

Graph draw just red and blue line and yellow one is not included into right dataAxis scale. Graph set scale 4 to 10 not 1-10. I cant set this parameters by myself, because of the amount of data.
How can I set graph options when auto-resize include all of groups (lines).

[avrahamcool]

any news on this?
this is a critical bug in the graph2d.

[lukaselmer]

Since it's fixed since a long time, and there hasn't been a release since more than a year, it seems to me that a release is due. Any updates? Do you need help?

[cakidnyc]

I also need this fix badly. Thanks.

[takahyon]

is there any news on this??

[oussjarrousse]

It does seem that the package is not being maintained anymore... that's sad!

[jgorene]

Hello there,

To bounce back on @Lopton said About the "initialDrawDone" property that would be problematic...
That's true but it would rather come from the itemSet value which is not defined at all in the Graph2d object.
By adding a condition to line 144 of the Graph2d file with something like the one below, everything goes back to normal.

if (me.itemSet)
    me.itemSet.initialDrawDone = true;

I have tested all the Graph2d and Timeline examples and they all work normally.

It remains to be confirmed of course to see all the interactions involved with itemSet undefined?

[shaniqwa]

is there any workaround to disable the scrolling completely? just display a simple graph?

[Nabrok]

is there any workaround to disable the scrolling completely? just display a simple graph?

You can set the option zoomable to false.

I also found that this works ...

graph2d.on('rangechange', () => graph2d.redraw());