Skip to content
Advertisement

Display HTML table from xml file over web browser without using any software or installation on unix

I am a very new to HTML and javascript. Have come across many questions with regard to my problem and after struggling a lot to find a solution, I am posting this question.

Problem statment:

I have an xml which I am trying to convert it to HTML so that I can display it over web browser in a table format.

<?xml version="1.0" encoding="UTF-8"?>
<chapter name="ndlkjfidm" date="dfhkryi">
    <edge name="nnn" P="ffgnp" V="0.825" T="125c">
        <seen name="seen1">
        </seen>
        <seen name="ABB">
            <mob name="adas_jk3" type="entry">
                <nod name="VSS" voltage="0.000000" vector="!ENXB" active_input="NA" active_ouput="ENX">
                    <temp name="ADS_DEFAULT_temp_LOW">
                        <raw nod="VBP" alt="7.05537e-15" jus="74.4619" />
                        <raw nod="VDDC" alt="4.63027e-10" jus="115.178" />
                        <raw nod="VDDP" alt="6.75316e-10" jus="115.178" />
                        <raw nod="VSS" alt="5.04568e-14" jus="9.63935" />
                        <raw nod="VBN" alt="1.21047e-14" jus="192.973" />
                        <raw nod="VBP" trip="4.58141e-12" />
                        <raw nod="VDDC" trip="5.19549e-09" />
                        <raw nod="VDDP" trip="5.49458e-08" />
                        <raw nod="VSS" trip="6.00563e-08" />
                        <raw nod="VBN" trip="8.94924e-11" />
                    </temp>
                </nod>
                <nod name="VSS" voltage="0.000000" vector="ENXB" active_input="NA" active_ouput="ENX">
                    <temp name="ADS_DEFAULT_temp_HIGH">
                        <raw nod="VBP" alt="7.05537e-15" jus="74.4644" />
                        <raw nod="VDDC" alt="1.52578e-14" jus="311.073" />
                        <raw nod="VDDP" alt="1.00188e-14" jus="521.709" />
                        <raw nod="VSS" alt="4.03483e-14" jus="11.1118" />
                        <raw nod="VBN" alt="1.21047e-14" jus="192.975" />
                        <raw nod="VBP" trip="4.58141e-12" />
                        <raw nod="VDDC" trip="1.29302e-12" />
                        <raw nod="VDDP" trip="4.92723e-08" />
                        <raw nod="VSS" trip="4.91887e-08" />
                        <raw nod="VBN" trip="8.95356e-11" />
                    </temp>
                </nod>
            </mob>
        </seen>
    </edge>
</chapter>

Below are the links that I have tried.

https://www.w3schools.com/xml/ajax_applications.asp

https://www.geeksforgeeks.org/read-xml-file-and-print-the-details-as-tabular-data-by-using-javascript/

Loop holes:

I can not install anything (sudo apt install apache2 etc..) or any software (xammp etc) Because of which the javascript does not display the table.

Tried with pandas as well but do not know how to display it over web browser and the xml too is very huge ( ~1GB)

Can someone please suggest me on how to get this done using any language combinations.

  1. python with HTML and javascript
  2. python with json and HTML
  3. HTML with javascript

Advertisement

Answer

This should solve your issue (as asked), using pandas:

import pandas as pd

xml_data = '''<?xml version="1.0" encoding="UTF-8"?>
<chapter name="ndlkjfidm" date="dfhkryi">
    <edge name="nnn" P="ffgnp" V="0.825" T="125c">
        <seen name="seen1">
        </seen>
        <seen name="ABB">
            <mob name="adas_jk3" type="entry">
                <nod name="VSS" voltage="0.000000" vector="!ENXB" active_input="NA" active_ouput="ENX">
                    <temp name="ADS_DEFAULT_temp_LOW">
                        <raw nod="VBP" alt="7.05537e-15" jus="74.4619" />
                        <raw nod="VDDC" alt="4.63027e-10" jus="115.178" />
                        <raw nod="VDDP" alt="6.75316e-10" jus="115.178" />
                        <raw nod="VSS" alt="5.04568e-14" jus="9.63935" />
                        <raw nod="VBN" alt="1.21047e-14" jus="192.973" />
                        <raw nod="VBP" trip="4.58141e-12" />
                        <raw nod="VDDC" trip="5.19549e-09" />
                        <raw nod="VDDP" trip="5.49458e-08" />
                        <raw nod="VSS" trip="6.00563e-08" />
                        <raw nod="VBN" trip="8.94924e-11" />
                    </temp>
                </nod>
                <nod name="VSS" voltage="0.000000" vector="ENXB" active_input="NA" active_ouput="ENX">
                    <temp name="ADS_DEFAULT_temp_HIGH">
                        <raw nod="VBP" alt="7.05537e-15" jus="74.4644" />
                        <raw nod="VDDC" alt="1.52578e-14" jus="311.073" />
                        <raw nod="VDDP" alt="1.00188e-14" jus="521.709" />
                        <raw nod="VSS" alt="4.03483e-14" jus="11.1118" />
                        <raw nod="VBN" alt="1.21047e-14" jus="192.975" />
                        <raw nod="VBP" trip="4.58141e-12" />
                        <raw nod="VDDC" trip="1.29302e-12" />
                        <raw nod="VDDP" trip="4.92723e-08" />
                        <raw nod="VSS" trip="4.91887e-08" />
                        <raw nod="VBN" trip="8.95356e-11" />
                    </temp>
                </nod>
            </mob>
        </seen>
    </edge>
</chapter>


'''

One option to read the xml would be:

df = pd.read_xml(xml_data)
# df
html = df.to_html()
print(html)

Result:

<table border="1" class="dataframe">
  <thead>
    <tr style="text-align: right;">
      <th></th>
      <th>name</th>
      <th>P</th>
      <th>V</th>
      <th>T</th>
      <th>seen</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>0</th>
      <td>nnn</td>
      <td>ffgnp</td>
      <td>0.825</td>
      <td>125c</td>
      <td>NaN</td>
    </tr>
  </tbody>
</table>

Of course, you can drill down into that xml:

df = pd.read_xml(xml_data, xpath=".//nod")
# df
html = df.to_html()
print(html)

This would result in:

<table border="1" class="dataframe">
  <thead>
    <tr style="text-align: right;">
      <th></th>
      <th>name</th>
      <th>voltage</th>
      <th>vector</th>
      <th>active_input</th>
      <th>active_ouput</th>
      <th>temp</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>0</th>
      <td>VSS</td>
      <td>0.0</td>
      <td>!ENXB</td>
      <td>NaN</td>
      <td>ENX</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>1</th>
      <td>VSS</td>
      <td>0.0</td>
      <td>ENXB</td>
      <td>NaN</td>
      <td>ENX</td>
      <td>NaN</td>
    </tr>
  </tbody>
</table>

Or even:

df = pd.read_xml(xml_data, xpath=".//raw")
# df
html = df.to_html()
print(html)

Returning:

<table border="1" class="dataframe">
  <thead>
    <tr style="text-align: right;">
      <th></th>
      <th>nod</th>
      <th>alt</th>
      <th>jus</th>
      <th>trip</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>0</th>
      <td>VBP</td>
      <td>7.055370e-15</td>
      <td>74.46190</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>1</th>
      <td>VDDC</td>
      <td>4.630270e-10</td>
      <td>115.17800</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>2</th>
      <td>VDDP</td>
      <td>6.753160e-10</td>
      <td>115.17800</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>3</th>
      <td>VSS</td>
      <td>5.045680e-14</td>
      <td>9.63935</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>4</th>
      <td>VBN</td>
      <td>1.210470e-14</td>
      <td>192.97300</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>5</th>
      <td>VBP</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>4.581410e-12</td>
    </tr>
    <tr>
      <th>6</th>
      <td>VDDC</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>5.195490e-09</td>
    </tr>
    <tr>
      <th>7</th>
      <td>VDDP</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>5.494580e-08</td>
    </tr>
    <tr>
      <th>8</th>
      <td>VSS</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>6.005630e-08</td>
    </tr>
    <tr>
      <th>9</th>
      <td>VBN</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>8.949240e-11</td>
    </tr>
    <tr>
      <th>10</th>
      <td>VBP</td>
      <td>7.055370e-15</td>
      <td>74.46440</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>11</th>
      <td>VDDC</td>
      <td>1.525780e-14</td>
      <td>311.07300</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>12</th>
      <td>VDDP</td>
      <td>1.001880e-14</td>
      <td>521.70900</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>13</th>
      <td>VSS</td>
      <td>4.034830e-14</td>
      <td>11.11180</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>14</th>
      <td>VBN</td>
      <td>1.210470e-14</td>
      <td>192.97500</td>
      <td>NaN</td>
    </tr>
    <tr>
      <th>15</th>
      <td>VBP</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>4.581410e-12</td>
    </tr>
    <tr>
      <th>16</th>
      <td>VDDC</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>1.293020e-12</td>
    </tr>
    <tr>
      <th>17</th>
      <td>VDDP</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>4.927230e-08</td>
    </tr>
    <tr>
      <th>18</th>
      <td>VSS</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>4.918870e-08</td>
    </tr>
    <tr>
      <th>19</th>
      <td>VBN</td>
      <td>NaN</td>
      <td>NaN</td>
      <td>8.953560e-11</td>
    </tr>
  </tbody>
</table>

The following pandas documentation might be helpful:

https://pandas.pydata.org/docs/dev/reference/api/pandas.read_xml.html

and

https://pandas.pydata.org/pandas-docs/stable/reference/api/pandas.DataFrame.to_html.html

Advertisement