How can I display this chunk of html output?

🎈 Using Streamlit
2

Hello @yellowPanther,

Interestingly, when you remove most of the newlines in the HTML file, it works, at least on my Firefox :

import streamlit as st

html_code = """
<table class="eli5-weights eli5-feature-importances" style="border-collapse: collapse; border: none; margin-top: 0em; table-layout: auto;">
<thead>
<tr style="border: none;">
    <th style="padding: 0 1em 0 0.5em; text-align: right; border: none;">Weight</th>
    <th style="padding: 0 0.5em 0 0.5em; text-align: left; border: none;">Feature</th>
</tr>
</thead>
<tbody>
    <tr style="background-color: hsl(120, 100.00%, 80.00%); border: none;">
        <td style="padding: 0 1em 0 0.5em; text-align: right; border: none;">
            0.4567 &plusmn; 0.5815
        </td>
        <td style="padding: 0 0.5em 0 0.5em; text-align: left; border: none;">
            x3
        </td>
    </tr>
    <tr style="background-color: hsl(120, 100.00%, 81.40%); border: none;">
        <td style="padding: 0 1em 0 0.5em; text-align: right; border: none;">
            0.4116 &plusmn; 0.5792
        </td>
        <td style="padding: 0 0.5em 0 0.5em; text-align: left; border: none;">
            x2
        </td>
    </tr>
    <tr style="background-color: hsl(120, 100.00%, 93.05%); border: none;">
        <td style="padding: 0 1em 0 0.5em; text-align: right; border: none;">
            0.1008 &plusmn; 0.2772
        </td>
        <td style="padding: 0 0.5em 0 0.5em; text-align: left; border: none;">
            x0
        </td>
    </tr>
    <tr style="background-color: hsl(120, 100.00%, 96.96%); border: none;">
        <td style="padding: 0 1em 0 0.5em; text-align: right; border: none;">
            0.0309 &plusmn; 0.0822
        </td>
        <td style="padding: 0 0.5em 0 0.5em; text-align: left; border: none;">
            x1
        </td>
    </tr>
</tbody>
"""

st.markdown(html_code, unsafe_allow_html=True)

image

(well I’m not sure it finds the .eli5-weights .eli5-feature-importances CSS classes, you may need to import them using this snippet.)

2 Likes