Extract raw value in data.js, use fixed 200°C max for bar height, add hover tooltip

This commit is contained in:
2026-06-22 18:56:07 +05:30
parent 551278b904
commit 94bd3de12d
2 changed files with 8 additions and 14 deletions
+6 -11
View File
@@ -7,12 +7,10 @@ export function createChartForZone(zoneId) {
return d.toLocaleTimeString('en-US', { hour12: false }); return d.toLocaleTimeString('en-US', { hour12: false });
} }
function maxValue() { const MAX_TEMP = 200;
let m = 0;
for (const h of history) { function barHeight(value) {
if (h.value > m) m = h.value; return Math.max(4, (value / MAX_TEMP) * 100);
}
return m || 100;
} }
function render() { function render() {
@@ -29,11 +27,9 @@ export function createChartForZone(zoneId) {
</span> </span>
`; `;
const max = maxValue();
let html = ''; let html = '';
for (const h of history) { for (const h of history) {
const pct = Math.max(4, (h.value / max) * 100); html += `<div class="bar-wrapper"><div class="bar" style="height:${barHeight(h.value)}%" title="${h.value}°C"></div><span class="bar-label">${formatTime(h.time)}</span></div>`;
html += `<div class="bar-wrapper"><div class="bar" style="height:${pct}%"></div><span class="bar-label">${formatTime(h.time)}</span></div>`;
} }
chartEl.innerHTML = html; chartEl.innerHTML = html;
} }
@@ -56,8 +52,7 @@ export function createChartForZone(zoneId) {
return { return {
element: card, element: card,
update(val) { update(value) {
const value = typeof val === 'object' && val !== null ? val.value : val;
history.push({ value, time: new Date() }); history.push({ value, time: new Date() });
if (history.length > MAX_HISTORY) history.shift(); if (history.length > MAX_HISTORY) history.shift();
render(); render();
+2 -3
View File
@@ -5,7 +5,6 @@ async function fetchTemperature(zoneId) {
// Don't change this function signature // Don't change this function signature
export async function attachChart(chartInstance, zoneId) { export async function attachChart(chartInstance, zoneId) {
await fetchTemperature(zoneId).then(temp => { const temp = await fetchTemperature(zoneId);
chartInstance.update(temp); chartInstance.update(temp.value);
});
} }