Viewing a saved revision (read-only)
d90d3b25ee2b4100ac2750055deb19b4
Svelte Starter: Timeline
A vertical timeline visualization presents two parallel event sequences, shown on the left and right sides of a central axis. Each event appears as a colored dot that expands into a card with a date, title, and description when clicked. Users can toggle between the two perspectives using the fixed buttons at the top. The layout uses a d3 time scale to position events proportionally, with Svelte managing the interactive state and component rendering.
AI-generated descriptionVertikale Timeline
Template, um anhand einer mittig platzierten, vertikalen Timeline einzelne Events zu erzählen. Es gibt zwei Event-Stränge (links und rechts), um beispielsweise dieselbe Geschichte aus 2 Perspektiven zu erzählen. Sie lassen sich zentral über die obigen Buttons aus- und einklappen. Einzelne Events lassen sich per Klick auf die Kreise ein- und ausklappen.
Struktur
store.js: Beispiel-TimelinedatenTimeline.svelte: Haupt-Container und KoordinatorTimelineEvent.svelte: Individuelle Event-KomponentenApp.svelte: Root-Komponente