Streamlit.image does not accurately display SVGs

[KKJSP]

Summary

The documentation for st.image states that it supports SVG strings. But on rendering certain files, it doesn't show the complete image.

I found a workaround in this post on the forum which shows the image accurately.

Steps to reproduce

Here is a basic streamlit app showcasing the bug. This is the SVG file that shows this issue (I have zipped it since Github doesn't allow uploading SVGs).

Code snippet:

import streamlit as st
import base64

file = st.file_uploader("SVG File", type="svg")

if file is not None:
    svg_text = file.read().decode("UTF-8")

    if st.checkbox("Render using html"):
        st.write("Rendered using html")
        b64 = base64.b64encode(svg_text.encode('utf-8')).decode("utf-8")
        html = f"<img src='data:image/svg+xml;base64,{b64}'/>"
        st.markdown(html, unsafe_allow_html=True)
    else:
        st.write("Rendered using st.image")
        st.image(svg_text)

The code I used to generate the SVG file (It's also attached above)

import numpy as np
import plotly.graph_objects as go

data = np.random.random((10, 100))
fig = go.Figure(go.Heatmap(z=data))
fig.write_image("test.svg")

Expected behavior:

st.image should show the same image as the markdown based render

Actual behavior:

The image rendered using st.image doesn't show the entire image.

Image rendered using st.image

Image rendered using HTML

Is this a regression?

Unknown

Debug info

• Streamlit version: 1.0.0
• Python version: 3.7.10
• Using Conda environment
• OS version: MacOS 10.14.5
• Browser version: Google chrome Version 92.0.4515.159 (Official Build) (x86_64)

[vdonato]

Thanks for reporting this @KKJSP!

This one might be a tricky one given that, as far as I can tell, the root cause of the issue seems to lie with one of the libraries that we use to convert from svg -> react component (see peternewnham/react-html-parser#45 and peternewnham/react-html-parser#56), and the library seems to no longer be actively maintained (it seems like the original author is offering up ownership to someone that made a hard fork of it, though, so there's hope yet).

Given both the nature of the issue and the existence of a workaround, I have a hunch that putting out a proper fix won't be the highest priority item on our backlog, but I'll be sure to keep you updated on this issue in case we do have the spare cycles to try to get a fix out.

[KKJSP]

@vdonato Thank you for looking into it. It's fine for me, the workaround I mentioned above is sufficient.