Horizontal scroll in flowchart example

Continuing the discussion from Diagram not scrolling horizontally to fully cover the diagram:

Continuing the discussion from Diagram not scrolling horizontally to fully cover the diagram:

where can I do the same in flowchart example ? http://gojs.net/latest/samples/flowchart.html

My earlier comments only apply when implementing virtualization. All of the samples (that do not have “virtual…” in their name) work with real Nodes, so there is no problem with either layout or document bounds.

not able to scroll horizontally in this example http://gojs.net/latest/samples/flowchart.html

json for loading

{ “class”: “go.GraphLinksModel”,
“linkFromPortIdProperty”: “fromPort”,
“linkToPortIdProperty”: “toPort”,
“nodeDataArray”: [
{“category”:“Comment”, “loc”:“360 -10”, “text”:“Kookie Brittle”, “key”:-13},
{“key”:-1, “category”:“Start”, “loc”:“175 0”, “text”:“Start”},
{“key”:0, “loc”:“0 77”, “text”:“Preheat oven to 375 F”},
{“key”:1, “loc”:“175 100”, “text”:“In a bowl, blend: 1 cup margarine, 1.5 teaspoon vanilla, 1 teaspoon salt”},
{“key”:2, “loc”:“175 190”, “text”:“Gradually beat in 1 cup sugar and 2 cups sifted flour”},
{“key”:3, “loc”:“175 270”, “text”:“Mix in 6 oz (1 cup) Nestle’s Semi-Sweet Chocolate Morsels”},
{“key”:4, “loc”:“175 370”, “text”:“Press evenly into ungreased 15x10x1 pan”},
{“key”:5, “loc”:“824 99.60000018775463”, “text”:“Finely chop 1/2 cup of your choice of nuts”},
{“key”:6, “loc”:“175 440”, “text”:“Sprinkle nuts on top”},
{“key”:7, “loc”:“175 500”, “text”:“Bake for 25 minutes and let cool”},
{“key”:8, “loc”:“175 570”, “text”:“Cut into rectangular grid”},
{“key”:-2, “category”:“End”, “loc”:“175 640”, “text”:“Enjoy!”}
“linkDataArray”: [
{“from”:1, “to”:2, “fromPort”:“B”, “toPort”:“T”, “points”:[175,140.2508972167969,175,150.2508972167969,175,150.2508972167969,175,147.68682708740235,175,147.68682708740235,175,157.68682708740235]},
{“from”:2, “to”:3, “fromPort”:“B”, “toPort”:“T”, “points”:[175,222.31317291259768,175,232.31317291259768,175,232.31317291259768,175,227.68682708740235,175,227.68682708740235,175,237.68682708740235]},
{“from”:3, “to”:4, “fromPort”:“B”, “toPort”:“T”, “points”:[175,302.3131729125977,175,312.3131729125977,175,320,175,320,175,327.6868270874023,175,337.6868270874023]},
{“from”:4, “to”:6, “fromPort”:“B”, “toPort”:“T”, “points”:[175,402.3131729125976,175,412.3131729125976,175,412.9377243041992,175,412.9377243041992,175,413.5622756958008,175,423.5622756958008]},
{“from”:6, “to”:7, “fromPort”:“B”, “toPort”:“T”, “points”:[175,456.4377243041992,175,466.4377243041992,175,466.4377243041992,175,465.6245513916016,175,465.6245513916016,175,475.6245513916016]},
{“from”:7, “to”:8, “fromPort”:“B”, “toPort”:“T”, “points”:[175,524.3754486083984,175,534.3754486083984,175,535,175,535,175,535.6245513916016,175,545.6245513916016]},
{“from”:8, “to”:-2, “fromPort”:“B”, “toPort”:“T”, “points”:[175,594.3754486083984,175,604.3754486083984,175,604.3754486083984,175,596.944796894872,175,596.944796894872,175,606.944796894872]},
{“from”:-1, “to”:0, “fromPort”:“B”, “toPort”:“T”, “points”:[175,24.773340092148892,175,34.77334009214889,175,42.66780789397484,0,42.66780789397484,0,50.56227569580078,0,60.56227569580078]},
{“from”:-1, “to”:1, “fromPort”:“B”, “toPort”:“T”, “points”:[175,24.773340092148892,175,34.77334009214889,175,42.261221437676014,175,42.261221437676014,175,49.74910278320313,175,59.74910278320313]},
{“from”:-1, “to”:5, “fromPort”:“B”, “toPort”:“T”, “points”:[175,24.773340092148892,175,34.77334009214889,175,49.99894583575254,824,49.99894583575254,824,65.22455157935619,824,75.22455157935619]},
{“from”:5, “to”:4, “fromPort”:“B”, “toPort”:“T”, “points”:[824,123.97544879615306,824,133.97544879615305,824,132,824,132,824,316,175,316,175,327.6868270874023,175,337.6868270874023]},
{“from”:0, “to”:4, “fromPort”:“B”, “toPort”:“T”, “points”:[0,93.43772430419921,0,103.43772430419921,0,100,0,100,0,316,175,316,175,327.6868270874023,175,337.6868270874023]}


just wanted to clarify , Am I misunderstanding something or the issue exist ?

Thank you

I’m not able to reproduce this problem. Does it happen in other browsers?

I have checked in chrome and firefox and the issue exist .

here is a sample video

wasnt able to upload videos here

I tried using the direction buttons and it works , but if i am trying to mouse scroll it doesnt work , should I set something for the scroll to occur ?

This is a problem with the trackpad and not a mouse, correct?

This may be a bug, we’ll investigate.

yeah I am using a trackpad on mac , thank you

Thanks for pointing this out. The trackpad scrolling will be improved in the next release, though it may take us longer to get it perfect on all platforms/browsers.

sure looking forward to your release , please do update me with further information regarding this.

We’ve just released GoJS 1.6.3, see if it works as you’d expect now.


yeah it works now :smile: thanks