Spaces:
Running
Running
File size: 3,793 Bytes
30e7eba 90b3e79 30e7eba 90b3e79 d19f708 90b3e79 d19f708 90b3e79 d19f708 90b3e79 d19f708 90b3e79 d19f708 90b3e79 30e7eba 90b3e79 d19f708 90b3e79 d19f708 90b3e79 d19f708 30e7eba 90b3e79 30e7eba 90b3e79 30e7eba de2f69e 30e7eba 90b3e79 de2f69e 30e7eba 90b3e79 d19f708 90b3e79 30e7eba |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 |
<!DOCTYPE html>
<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://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-AMS_HTML"></script>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #121212; /* Dark background */
color: #e0e0e0; /* Light text color */
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
transition: background-color 0.3s;
}
h1 {
margin-bottom: 20px;
}
label {
margin-top: 10px;
}
input[type="number"] {
padding: 10px;
margin: 10px 0;
border: none;
border-radius: 5px;
background-color: #1f1f1f; /* Darker input background */
color: #e0e0e0; /* Input text color */
width: 200px;
transition: background-color 0.3s;
}
input[type="number"]:focus {
background-color: #272727; /* Input focus color */
outline: none;
}
button {
padding: 10px 20px;
border: none;
border-radius: 5px;
background-color: #6200ea; /* Button color */
color: white;
cursor: pointer;
transition: background-color 0.3s;
}
button:hover {
background-color: #3700b3; /* Button hover color */
}
.output {
margin-top: 20px;
padding: 15px;
border: 1px solid #444; /* Output border */
border-radius: 4px;
background-color: #1f1f1f; /* Output background */
width: 300px; /* Set width for output */
text-align: center;
}
.latex {
margin-top: 10px;
color: #90caf9; /* LaTeX output color */
}
</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>
<label for="epochs">Number of Epochs:</label>
<input type="number" id="epochs" value="1"><br>
<button id="calculate_btn">Calculate</button>
<div class="output">
<h3 id="result_text"></h3>
<div id="result_latex" class="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 representations
const latexEquationOriginal = `\\[ Total \\: Time = \\frac{S}{405} \\times n \\]`;
const latexEquationValues = `\\[ Total \\: Time = \\frac{${datasetSize}}{405} \\times ${epochs} = ${totalTime.toFixed(4)} \\: minutes \\]`;
// Update HTML elements
document.getElementById("result_text").innerText = `Total Time: ${totalTime.toFixed(4)} minutes`;
document.getElementById("result_latex").innerHTML = latexEquationOriginal + "<br>" + latexEquationValues;
// Render LaTeX
MathJax.Hub.Queue(["Typeset", MathJax.Hub]);
};
</script>
</body>
</html>
|