Skip to content
New issue

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

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

Already on GitHub? # to your account

Incorrect conversion of matplotlib SVG plots #1849

Closed
goyodiaz opened this issue Aug 23, 2022 · 15 comments · Fixed by #1890
Closed

Incorrect conversion of matplotlib SVG plots #1849

goyodiaz opened this issue Aug 23, 2022 · 15 comments · Fixed by #1890

Comments

@goyodiaz
Copy link

Steps to reproduce:

  • Display a matplotlib SVG plot in a notebook.
  • Export as HTML
  • There is no plot in the output.

Notebook showing the issue
nbconvert output

Screenshot of the notebook:
notebook

Screenshot of the HTML output:
nbconvert_output

Nbconvert version: 7.0.0

@adl
Copy link

adl commented Aug 30, 2022

This is related to #1836

@goyodiaz
Copy link
Author

@adl Yes, I guess clean_html is returning bytes now and the output needs to be decoded again.

@adl
Copy link

adl commented Aug 31, 2022

The encoding expains the b'...' in the output, but the more serious issue is that clean_html seems to strips all tags inside the <svg>...</svg> element, making <svg> useless.

>>> from lxml.html import clean
>>> icon = '''
... <?xml version="1.0" encoding="UTF-8"?>
... <!-- Created with Inkscape (http://www.inkscape.org/) -->
... <svg id="svg3196" width="16" height="16" version="1.0" xmlns="http://www.w3.org/2000/svg">
...  <rect id="rect2388" transform="rotate(-90)" x="-15.5" y="3.5" width="14" height="9" rx="0" ry="0" style="fill:none;stroke-linecap:square;stroke:#969696"/>
...  <path id="rect3160" d="m6.5 0.5h3" style="fill:none;stroke-linecap:square;stroke:#969696"/>
...  <rect id="rect3162" transform="rotate(-90)" x="-14" y="5" width="4" height="6" style="fill:#878787"/>
... </svg>'''
>>> clean.clean_html(icon)
'<svg id="svg3196" width="16" height="16">\n \n \n \n</svg>'

@goyodiaz
Copy link
Author

I guess that can be fixed by using a custom Cleaner object, but I have no idea how to express that in the template.

@adl
Copy link

adl commented Sep 1, 2022

An additional point.

Looking at the templates, I find weird that HTML is conditionally passed through clean_html with:

{%- if resources.should_sanitize_html %}
{{ output.data['text/html'] | clean_html }}
{%- else %}
{{ output.data['text/html'] }}
{%- endif %}

where should_sanitize_html defaults to False, while SVG goes through clean_html unconditionally.

@adl
Copy link

adl commented Sep 6, 2022

@martinRenou and @SylvainCorlay this clean_html was added by 4a5eeb4. Can you comment?

@adl
Copy link

adl commented Sep 23, 2022

With #1854 the implementation of clean_html has changed to only allow a handful of tags, and escape everything else. So instead of a blank SVG image, we can now see the SVG source in the rendered HTML.

@luboshanus
Copy link

luboshanus commented Oct 21, 2022

Any changes/updates?
nbconvert 7.2.2 still doing the SVG source in html. Thought at first, it is julia thing jheinen/GR.jl#482

Or, when will nbconvert let svg figures be in .html?

@JBlaschke
Copy link

Urgh -- I wasted loads of time trying to make a high-res png plot "look" like an svg, and I finally gave up and used: #1836 (comment)

@luboshanus
Copy link

Thanks for the comments and help!

Isn't then this simple enough that somebody implements it in nbconvert? Or, as I have asked, is there a reason (good one) to not plot/show svg figure in html? Current solution actually create a super dirty html, not clean one. :)

@akx
Copy link
Contributor

akx commented Oct 26, 2022

This should be fixed by #1890 ...

akx added a commit to akx/nbconvert that referenced this issue Oct 27, 2022
akx added a commit to akx/nbconvert that referenced this issue Oct 27, 2022
akx added a commit to akx/nbconvert that referenced this issue Oct 27, 2022
@luboshanus
Copy link

nbconvert 7.2.3

I still have a problem with convert.

in julia 1.8.2., from notebook to html

Screenshot 2022-11-01 at 16 24 40

@desilinguist
Copy link

desilinguist commented Nov 1, 2022

Yes, I am seeing the same issue as @luboshanus and just seeing black canvases.

image

@torext
Copy link

torext commented Dec 2, 2022

Running 7.2.5 and seeing the same as @luboshanus & @desilinguist.

@desilinguist
Copy link

desilinguist commented Dec 2, 2022

I posted a workaround here if you are using nbconvert programmatically.

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

7 participants