brut/bincio-activity
1
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

fix activities' types

Browse Source
This commit is contained in:
Davide Scaini
2026-03-29 10:37:08 +02:00
parent 3441079913
commit 643d092acd
5 changed files with 60 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/src/components/ActivityCharts.svelte
+12 -13
View File
@@ -1,4 +1,5 @@
<script lang="ts">
import * as Plot from '@observablehq/plot';
import { onMount } from 'svelte';
import type { Timeseries } from '../lib/types';
@@ -10,7 +11,6 @@
let activeTab: Tab = 'elevation';
let chartEl: HTMLDivElement;
let Plot: any;
let chart: SVGElement | null = null;
// Pre-build data array once
@@ -34,18 +34,17 @@
cadence: 'Cadence',
};
onMount(async () => {
Plot = await import('@observablehq/plot');
onMount(() => {
renderChart();
});
$: if (Plot && chartEl) {
activeTab; // reactive dependency
$: if (chartEl) {
activeTab; // reactive dependency — re-render when tab changes
renderChart();
}
function renderChart() {
if (!Plot || !chartEl) return;
if (!chartEl) return;
chart?.remove();
const w = chartEl.clientWidth || 800;
@@ -59,25 +58,25 @@
if (activeTab === 'elevation' && hasElevation) {
yKey = 'elevation'; yLabel = 'Elevation (m)'; color = '#00c8ff';
marks.push(
Plot.areaY(data, { x: 't', y: yKey, fill: color, fillOpacity: 0.15, curve: 'monotoneX' }),
Plot.lineY(data, { x: 't', y: yKey, stroke: color, strokeWidth: 1.5, curve: 'monotoneX' }),
Plot.areaY(data, { x: 't', y: yKey, fill: color, fillOpacity: 0.15, curve: 'monotone-x' }),
Plot.lineY(data, { x: 't', y: yKey, stroke: color, strokeWidth: 1.5, curve: 'monotone-x' }),
);
} else if (activeTab === 'speed' && hasSpeed) {
yKey = 'speed'; yLabel = 'Speed (km/h)'; color = '#ff6b35';
marks.push(
Plot.areaY(data, { x: 't', y: yKey, fill: color, fillOpacity: 0.15, curve: 'monotoneX' }),
Plot.lineY(data, { x: 't', y: yKey, stroke: color, strokeWidth: 1.5, curve: 'monotoneX' }),
Plot.areaY(data, { x: 't', y: yKey, fill: color, fillOpacity: 0.15, curve: 'monotone-x' }),
Plot.lineY(data, { x: 't', y: yKey, stroke: color, strokeWidth: 1.5, curve: 'monotone-x' }),
);
} else if (activeTab === 'hr' && hasHR) {
yKey = 'hr'; yLabel = 'Heart Rate (bpm)'; color = '#f87171';
marks.push(
Plot.areaY(data, { x: 't', y: yKey, fill: color, fillOpacity: 0.15, curve: 'monotoneX' }),
Plot.lineY(data, { x: 't', y: yKey, stroke: color, strokeWidth: 1.5, curve: 'monotoneX' }),
Plot.areaY(data, { x: 't', y: yKey, fill: color, fillOpacity: 0.15, curve: 'monotone-x' }),
Plot.lineY(data, { x: 't', y: yKey, stroke: color, strokeWidth: 1.5, curve: 'monotone-x' }),
);
} else if (activeTab === 'cadence' && hasCadence) {
yKey = 'cadence'; yLabel = 'Cadence (rpm)'; color = '#a78bfa';
marks.push(
Plot.lineY(data, { x: 't', y: yKey, stroke: color, strokeWidth: 1.5, curve: 'monotoneX' }),
Plot.lineY(data, { x: 't', y: yKey, stroke: color, strokeWidth: 1.5, curve: 'monotone-x' }),
);
}