observablehq / feedback

Customer submitted bugs and feature requests
42 stars 3 forks source link

png/svg download to include legend? #541

Closed ijlyttle closed 1 year ago

ijlyttle commented 1 year ago

I don't know if this is a Plot question or an observablehq.com question, but I thought I'd start here.

On any of the charts with legends here: https://observablehq.com/@observablehq/plot-legends, if I click "Download PNG" or "Download SVG", I get an image of the chart that does not include the legend. I imagine this follows from the legend being an add-on to the chart.

Could there be a convenient way to get them both in an image download?

Thanks!

Fil commented 1 year ago

It's mostly an observablehq question, but it's also a Plot question, since Plot returns an HTML figure. Either way we'll need to find a good solution!

For PNG downloads, I've started experimenting with the image-to-html library here: https://observablehq.com/@fil/hello-html-to-image ; one could also try with html2canvas https://observablehq.com/@fil/hello-html2canvas

For SVG, I haven't found how to generically convert HTML to SVG, but I have a heap of code that 99% works. https://observablehq.com/@fil/plot-figure-to-svg

mbostock commented 1 year ago

Please file this in the Observable feedback repository:

https://github.com/observablehq/feedback

I would transfer it but for some reason GitHub isn’t letting me.

Fil commented 1 year ago

I tried my luck and github let me do it :)

ijlyttle commented 1 year ago

@fil Thanks! The html-to-image tool will let me do what I need to, looking forward to an update in observablehq :)

CobusT commented 1 year ago

This now works! Try it out and let us know if you run into other issues.