Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Exporting an image #21

Closed
harrylojames opened this issue Aug 22, 2023 · 17 comments
Closed

Exporting an image #21

harrylojames opened this issue Aug 22, 2023 · 17 comments
Labels
enhancement New feature or request

Comments

@harrylojames
Copy link
Contributor

harrylojames commented Aug 22, 2023

How would I export a plot to html/png/svg?

Ideally I would like to be able to do something similar to Plotly i.e. fig.write_html("path/to/file.html") / fig.write_image("images/fig1.png") / fig.write_image("images/fig1.svg")

@juba
Copy link
Owner

juba commented Aug 23, 2023

Hi, this is a good question.

I don't think there is a simple way to do this right now. I should check how to implement this, but it could take some time.

@juba juba added the enhancement New feature or request label Aug 23, 2023
@harrylojames
Copy link
Contributor Author

Thank you for giving this thought! Any efforts would be greatly appreciated as it's a significant blocker to adopting this package in my workflows more generally

@juba
Copy link
Owner

juba commented Oct 8, 2023

Hi, and sorry for taking this long for looking into this issue.

I added a path argument to plot specification when using a jsdom renderer to allow to output the plot to an HTML or SVG file. So you should be able to do something like this:

from pyobsplot import Obsplot, Plot

oj = Obsplot(renderer="jsdom", theme="light")
oj(Plot.rectY(range(3), Plot.binX({"y": "count"})), path="out.html")

This is still experimental and only available in the github version.

Implementing this for the widget renderer doesn't work for the moment. But I believe that even if it works one day, it will only be able to generate a non-easily embeddable HTML file. But I'll continue to take a look into it.

@harrylojames
Copy link
Contributor Author

No stress at all. Things take time and when I briefly searched online this looked like it would be a tough nut to crack!

Thanks so much for knocking something up. I'll give it a go.

@juba
Copy link
Owner

juba commented Oct 8, 2023

In fact I just published pyobsplot 0.4.0 which allows to output plots generated by the jsdom renderer to an SVG or HTML file.

There is a bit of documentation about it here:

https://juba.github.io/pyobsplot/usage.html#saving-plots-to-file

Any feedback appreciated !

Output to file doesn't work for the widget renderer, but I'm not sure if it really makes sense anyway.

@harrylojames
Copy link
Contributor Author

Hi thanks for publishing!

Using the latest version with python 3.9 gives the following error.

     45     self.port = port
     46     self.theme = theme
---> 48 def plot(self) -> SVG | HTML:
     49     """Generates the plot by sending request to http node server.
     50 
     51     Returns:
     52         Either an HTML or SVG IPython.display object.
     53     """
     55     # Make POST request with plot spec

TypeError: unsupported operand type(s) for |: 'type' and 'type'

The | operator was added in Python 3.10. Given 3.12 was released this week it might be reasonable to set the minimum Python version as 3.10 but your call!

Not a blocker for me as I'm happy to update my Python version :)

@juba
Copy link
Owner

juba commented Oct 10, 2023

Ah, you're right, thanks for pointing this out. I found this bug earlier but only put a workaround for CI tests.

The development version should be compatible with Python 3.9 again, sorry !

@juba
Copy link
Owner

juba commented Oct 10, 2023

Thanks to the solution in manzt/anywidget#339, saving widget output to an HTML file should now be possible. I'll try to publish a new package version shortly.

@juba
Copy link
Owner

juba commented Oct 11, 2023

v0.4.1 just released: https://github.com/juba/pyobsplot/releases/tag/v0.4.1

@harrylojames
Copy link
Contributor Author

Amazing! Thank you so much for looking into this. I will give it a go tomorrow and let you know how it goes

@harrylojames
Copy link
Contributor Author

PR to address a bug with saving SVGs #22

@harrylojames
Copy link
Contributor Author

Another update that I hope is helpful.

When exporting HTML the title font from my notebook is not preserved.

Perhaps this is an observable plot question and not a pyobsplot question!

op = Obsplot(renderer="jsdom")

op(
    {
        "marks": [
            Plot.tickX([0, 5, 10, 15])
        ], 
        "title" : "a",
        "style":{"font-family":"serif"},
    },
    path="test.html"
)

Do you know if this is fixable? Including font-family changes the font for the axis elements but not the title or caption.

I noticed Plotly preserves the title element when saving to SVG with Kaleido

@juba
Copy link
Owner

juba commented Oct 13, 2023

When you display the plot without exporting it to a file, your title is in a serif font ? As far as I can see the style option is applied to the <svg> element in the output, so it shouldn't change the font of title, subtitle, caption or legend.

@harrylojames
Copy link
Contributor Author

harrylojames commented Oct 20, 2023

Sorry for the delay. Yep that's correct the style option is applied to the svg element so my title remains unchanged. Just noticed there is an issue open on observable plot to be able to style the figure element.

What's the implications of adding a font family here? Perhaps borrowing the font family of h2, h3 and figcaption here?

This would allow one to share html exports over email for example and have them open with titles etc. styled properly.

@juba
Copy link
Owner

juba commented Oct 20, 2023

The styles in styles.css should be the default ones when plot is used in Observable. If you change them you would have to rebundle and rebuild the package in order for them to take effect.

So for the moment I think I'll wait for the upstream issue to be resolved.

@harrylojames
Copy link
Contributor Author

That makes sense thanks. What are your thoughts on this #24? Apologies if I've not fully absorbed your point above!

@harrylojames
Copy link
Contributor Author

harrylojames commented Nov 28, 2023

@juba closing as it's possible to export an image. I can split out more specific requests i.e. #23

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants