{"version":"1.0","type":"rich","title":"Debounced slider","description":"Two parallel sliders demonstrate the visual difference between immediate and debounced drag updates. The gray slider updates a year-range caption on every pointer movement, while the red slider applies a 200-millisecond delay via `d3.drag` and a custom `delayedUpdatePlot` callback. Both use `d3.scaleTime` with a domain from 1997 to 2016, rendered as SVG rectangles and an axis. The example highlights how debouncing reduces update frequency during continuous interaction, using D3 v4’s event handling.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-dfabb33e34ffac2a5ad68d80c91fac33?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}