Rendering Data Frames from an HTML code

Using Streamlit
1

Jupyter notebooks render pandas DataFrames in a nice format. Streamlit supports this too.

When I looked at the json code that creates .ipnyb files, I noticed that the dataframes are rendered using HTML code like this:

<div>
<style scoped>
    .dataframe tbody tr th:only-of-type {
        vertical-align: middle;
    }

    .dataframe tbody tr th {
        vertical-align: top;
    }

    .dataframe thead th {
        text-align: right;
    }
</style>
<table border="1" class="dataframe">
  <thead>
    <tr style="text-align: right;">
      <th></th>
      <th>AAPL</th>
      <th>GOOG</th>
    </tr>
    <tr>
      <th>Date</th>
      <th></th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>2010-12-16</th>
      <td>45.89</td>
      <td>295.56</td>
    </tr>
    <tr>
      <th>2010-12-17</th>
      <td>45.80</td>
      <td>295.10</td>
    </tr>
    <tr>
      <th>2010-12-20</th>
      <td>46.03</td>
      <td>297.23</td>
    </tr>
    <tr>
      <th>2010-12-21</th>
      <td>46.32</td>
      <td>301.23</td>
    </tr>
    <tr>
      <th>2010-12-22</th>
      <td>46.45</td>
      <td>302.44</td>
    </tr>
  </tbody>
</table>
</div>

When I pass this to st.markdown(unsafe_allow_html=True) it is being displayed as a static table. Is there any way to convert the output to Streamlit supported dataframe from this HTML code?

I specifically want to be able to render pandas DataFrames from their HTML code not using st.dataframe.

2

Maybe try

import pandas as pd
html_df = '''<div> ...  </div>'''
df = pd.read_html(html_df )
df
3

Nope, it did not work. It is returning a list with the text of the dataframe

4

Just read the docs, pd.read_html returns a list of data frames. So you just need to index the list to get your dataframe.
image

image
image926×488 19.8 KB