This repository has been archived on 2023-08-20. You can view files and clone it, but cannot push or open issues or pull requests.
spark-art-dashboard/index.html
Diogo Cordeiro 838cc1d950 Limit the log size so that dashboard charts are not overloaded
Added configuration constants
This script is designed to be ran by Dash (which is faster than Bash)
2018-10-03 03:10:49 +01:00

55 lines
2.1 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Spark ART Dashboard</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.diogo.site/projects/excalibur_template/assets/css/main.css">
<style>
#chart-container {
display: flex;
flex-direction: column;
width: 100%;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
#chart-container > canvas {
height: 400px;
}
</style>
</head>
<body>
<header id="header">
<nav id="side-menu">
<label for="show-menu" id="menu-button">Menu</label>
<input id="show-menu" role="button" type="checkbox">
<ul id="menu">
<li><a href="#" class="current">Stats</a></li>
</ul>
</nav>
<h1>ART Dashboard</h1>
<div id="ingestion-rate-box">
<label for="ingestion-rate-controller">Ingestion Rate</label>
<input id="ingestion-rate" type="number">
<input id="ingestion-rate-update" type="submit" value="Update">
</div>
</header>
<div id="chart-container">
<canvas id="chart-ingestionRate"></canvas>
<canvas id="chart-Accuracy (%)"></canvas>
<canvas id="chart-cost"></canvas>
<canvas id="chart-Window (ms)"></canvas>
<canvas id="chart-Delay (ms)"></canvas>
<canvas id="chart-execTime (ms)"></canvas>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-annotation/0.5.7/chartjs-plugin-annotation.min.js"></script>
<script src="chart.js"></script>
<script src="ingestion-rate.js"></script>
<footer id="footer">
<p><a href="https://github.com/diogogithub/spark-art-dashboard">ART Dashboard</a> and <a href="https://github.com/diogogithub/excalibur_template/">Excalibur template</a> by <a href="https://www.diogo.site/">Diogo Cordeiro</a> - <a href="https://www.inesc-id.pt/">INESC-ID</a>
</footer>
</body>
</html>