{"version":"1.0","type":"rich","title":"D3 Transitions - Easing Function","description":"A single circle animates horizontally across an 800-by-100 SVG canvas, moving between x-coordinates of 100 and 700 each time the \"Update data\" button is clicked. A dropdown menu lists all available D3 easing functions (e.g., `d3.easeCubicOut`), and the selected function dictates the circle’s motion profile during the 750-millisecond transition. The example uses D3 v7.8.5’s selection API, `.transition().duration().ease()`, to tween the circle’s `cx` attribute, with a semi-transparent purple fill and no additional data source.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/f5f01879da33410c88f824498847d4e0?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}