Your journey from data science to animated web graphics
summary
Quarto embeds Observable JavaScript so a Quarto install alone runs interactive plots: built a bar chart with tooltips and ARIA labels, a globe that rotates by binding an angle to the reactive now clock, and a conditional traffic‑light demo. An interactive table enforces a minimum of three selections before the bar chart renders, and a width breakpoint at 700px swaps horizontal/vertical layouts. For animated, smooth transitions, a Quarto extension called Sverto drops Svelte/D3 components into documents and updates them declaratively.
AI-written summary · about
chapters (13)
- 0:00Introduction
- 1:06Bridging technical skills
- 2:53Getting started with OJS
- 3:55Building interactive plots
- 5:42Integrating data and accessibility
- 7:38Levelling up your graphics
- 8:38Reactivity and animation
- 10:44Conditional content
- 11:54Interactive user interfaces
- 13:54Limitations and new approaches
- 15:31Introducing Sverto
- 17:49Implementing Svelte components
- 18:45Resources and conclusion
related talks
14mUnlock the Power of DataViz Animation and Interactivity in Quarto
16mThese are a few of my favorite things (about Quarto presentations)
24mCreating Interactive Data Visualizations for the Web
38mStorytelling with your data
01h 08mThe quest for the graphical web
33mPainting with Data
26mHooked on D3: Creating Animated Ch(art)s with D3 and React
26m"Where Numbers Meet Art: Building Data Visualizations In The Modern Web"