Heat-Tracker/public/heatmap.html

46 lines
1.7 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Heat Map Fuego Heat Tracker</title>
<link rel="icon" href="/favicon.ico">
<link rel="stylesheet" href="/styles.css">
</head>
<body>
<header class="main-header">
<img src="/image/logo.png" alt="Amazon Logo" class="logo">
<span class="header-title">| Fuego Heat Tracker</span>
<button class="nav-btn" onclick="location.href='/input.html'">Log Reading</button>
<button class="nav-btn" onclick="location.href='/heatmap.html'">Heat Map</button>
<button class="nav-btn" onclick="location.href='/trends.html'">Trends</button>
</header>
<div class="page-container heatmap">
<!-- Optional floor selector -->
<div class="floor-selector">
<label><input type="radio" name="floor" value="1" checked> Floor 1</label>
<label><input type="radio" name="floor" value="2"> Floor 2</label>
<label><input type="radio" name="floor" value="3"> Floor 3</label>
<label><input type="radio" name="floor" value="4"> Floor 4</label>
</div>
<!-- Scroll + zoom wrapper -->
<div id="heatmap-container">
<!-- the mapSvgContainer is where heatmap.js should append your SVG -->
<div id="mapSvgContainer" class="map-svg-container">
<!-- e.g. heatmap.js should do:
const svg = d3.select('#mapSvgContainer')
.append('svg')
.attr('width', fullWidth)
.attr('height', fullHeight);
svg.selectAll('rect.dock-door')... etc.
-->
</div>
</div>
</div>
<script src="/scripts/heatmap.js"></script>
</body>
</html>