Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Time Calculation for Dataset Training</title> | |
| <script src="https://gradio.s3.amazonaws.com/gradio/2.4.1/gradio.min.js"></script> | |
| <style> | |
| body { | |
| font-family: Arial, sans-serif; | |
| margin: 20px; | |
| padding: 20px; | |
| background-color: #f9f9f9; | |
| border: 1px solid #ddd; | |
| border-radius: 5px; | |
| } | |
| .output { | |
| margin-top: 20px; | |
| padding: 10px; | |
| border: 1px solid #ccc; | |
| border-radius: 4px; | |
| background-color: #fff; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <h1>Time Calculation for Dataset Training</h1> | |
| <label for="dataset_size">Dataset Size (kB):</label> | |
| <input type="number" id="dataset_size" value="67.4" step="0.1"><br><br> | |
| <label for="epochs">Number of Epochs:</label> | |
| <input type="number" id="epochs" value="1"><br><br> | |
| <button id="calculate_btn">Calculate</button> | |
| <div class="output"> | |
| <h3 id="result_text"></h3> | |
| <div id="result_latex"></div> | |
| </div> | |
| <script> | |
| // Function to calculate total time and update results | |
| document.getElementById("calculate_btn").onclick = function() { | |
| const datasetSize = parseFloat(document.getElementById("dataset_size").value); | |
| const epochs = parseInt(document.getElementById("epochs").value); | |
| // Calculate time | |
| const timePerEpoch = datasetSize / 405; | |
| const totalTime = timePerEpoch * epochs; | |
| // Create LaTeX representation | |
| const latexEquation = `\\[ T = \\frac{S}{405} \\times n \\]`; | |
| const latexOutput = `Total Time: ${totalTime.toFixed(4)} minutes<br>LaTeX Equation: ${latexEquation}`; | |
| // Update HTML elements | |
| document.getElementById("result_text").innerText = `Total Time: ${totalTime.toFixed(4)} minutes`; | |
| document.getElementById("result_latex").innerHTML = latexOutput; | |
| // Render LaTeX | |
| MathJax.typeset(); | |
| }; | |
| </script> | |
| <!-- Include MathJax for LaTeX rendering --> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-AMS_HTML"></script> | |
| </body> | |
| </html> | |