search

antlr / antlr4-lab

A client/server for trying out and learning about ANTLR
MIT License
36 stars 11 forks source link

[feature] add zoom ability to svg parse tree #18

Open parrt opened 2 years ago

parrt commented 2 years ago

or make it an img tag referring to url so users can open in another tab?

Hmm... can use window zoom now...maybe don't need.

kaby76 commented 1 year ago

I have something that you might look at and refine to add pan and zoom of the parse tree. Basically, it replaces the <div id="svgtree"> with a <canvas>. When the parse is done, it creates an Image control, sets the source with the svg, and draws it. https://github.com/kaby76/antlr4-lab/tree/combined

Working over at http://134.209.209.215/

parrt commented 1 year ago

Hmm...sounds good but downloaded image is now png not svg and lower quality. Hmm...let me see about just scroll bars. Now we can "open in another tab" so expanding is no problem.

download

parrt commented 1 year ago

ok, i'm gonna leave as-is and close this. Can expand window to see more. zoom of browser gives us the functionality we need. can also open in new tab for more control.

kaby76 commented 1 year ago

Browser-level pan and zoom work, but I think it would be better with a pan and zoom on the graph that doesn't also affect all other controls in the UI, e.g., the text boxes. Yes, "open in new tab" works, but it's not an obvious workaround (I overlooked trying that). Will play around with it further for my edification.

parrt commented 1 year ago

Hmm...yes, let's keep this open as something interesting my pop-up. The previous iframe solution was terrible but possibly just setting the width or something might work.