<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>CSV Table</title> <style> table { border-collapse: collapse; width: 100%; margin-top: 20px; } th, td { border: 1px solid #dddddd; text-align: left; padding: 8px; } th { background-color: #f2f2f2; } </style> </head> <body> <h2>CSV Data</h2> <table id="csv-table"> <!-- CSV data will be inserted here --> </table> <script> // Fetch CSV data fetch('merged-averaged-model_timings_2.1.0_12.1_NVIDIA_A10G_False.csv') .then(response => response.text()) .then(csvData => { // Parse CSV data var rows = csvData.trim().split('\n'); var table = document.getElementById('csv-table'); // Insert data into table rows.forEach(function(row) { var cells = row.split(','); var tr = document.createElement('tr'); cells.forEach(function(cell) { var td = document.createElement('td'); td.textContent = cell.trim(); tr.appendChild(td); }); table.appendChild(tr); }); }); </script> </body> </html>