Welcome to yEd Q&A!
Here you can ask questions and receive answers from other members of the community and yEd developers. And you can tell us your most wanted feature requests.


How to create mobile responsive graph

0 votes
Have already created graph for my website; however, I need to out a way to either remove the remove the flowchart legend which appears to the left of the graph or, otherwise, figure out how to make the graph mobile-responsive?

As it exists now, most of the graph is pushed off-screen on (at least) the smallest-dimensioned smartphones because of the space taken up by the flowchart legend.

Thouroughly have enjoyed figuring out how to use this amazing software, just need to take care of this last issue!

See my graph here:  http://www.perryrecommends.com/interconnected-life-diagram/connected-life.html

Thanks in advance for any help!

in Help by

1 Answer

+1 vote

I guess the "flowchart legend" you mentioned is actually GraphMLViewer's overview. In this case, you can disable the overview by passing the RunPlayer JavaScript function the argument pair "overview", "false". Please see also the GraphMLViewer Documentation.

by [yWorks] (160k points)
Wow, thanks for your quick response! This certainly did remove the GraphMLViewer's overview, as advertised.

Looks as if i didn't know enough to ask the right question, or, maybe, this step needed to have been taken care of first (i.e. remove the overview)?

With the overview removed the graph may have shifted slightly to the left; however, it is still mostly off-screen (again the url is: http://www.perryrecommends.com/interconnected-life-diagram/connected-life.html ).

Specifically, I need to left-align it or, otherwise, shift it to the left on the canvas, so that all of it will be viewable on the smallest smartphone screens. Here is a smartphone simulator view of how it looks now: http://mobiletest.me/samsung_galaxy_y_emulator/#u=http://www.perryrecommends.com/interconnected-life-diagram/connected-life.html

Whether this will involve adjusting the (left) margin/border, or coding some function to make it automatically response to the viewer's screen size, whatever works?

Thanks again for any additional help!


Please see the information on the viewport property in the GraphMLViewer Documentation.

Legal Disclosure | Privacy Policy