tskit-dev / tskit

Population-scale genomics
MIT License
151 stars 71 forks source link

Set padding, axis margins, etc for SVG plots using a transform #589

Open hyanwong opened 4 years ago

hyanwong commented 4 years ago

There are various places in the SVG code where we hard code units & padding, e.g. to make space for node labels, axes (in the case of ts.draw_svg) or for the root branch if there is one. Previously the suggestion has been to allow these to be set by the user using a matplotlib-style approach. However, I think it would be far better (easier and more flexible) to use an SVG transform on the plot frame. This not only allows us to specify units in e.g. ems (rather than pixels), but also allows fancy transforms like perspective shears etc.

The way I was thinking of it was that by default, the nodes of the tree (i.e. not including labels) are always thought of as fitting into a 1x1 box, from which graphical elements like node labels can spill out. The default transform is to scale this box up to just under the size of the width*height box, with an extra space of (say) 1em at the bottom to allow for node labels, and with any space at the top filled with a root branch length. The user can, however, specify a different transform, e.g. to give enough space to 90 degree rotated labels, or to different root branch lengths. It also means we don't have to add to the already excess number of parameters to the draw_svg functions.

I'm not sure how to make sure the coordinate system is transformed without squishing the circles used for node symbols etc, but it looks like vector effects might allow this somehow.

jeromekelleher commented 4 years ago

SGTM @hyanwong - hard coding spacings was a nasty hack, and doing things in the "right way" SVG-wise sounds great.

jeromekelleher commented 3 years ago

I think this is basically out of date now @hyanwong with all the CSS stuff that's gone in?