{"version":"1.0","type":"rich","title":"Vue Circle Pack with Gradients","description":"This example shows a zoomable circle packing visualization of the Vue.js core repository, where each circle represents a file or directory, sized by file size and colored by file extension. Hierarchical data is parsed with `d3.hierarchy` and `d3.pack`, while custom gradient definitions via SVG `radialGradient` elements enhance circle depth. Interactive pan and zoom is enabled through `d3.zoom`, with file sizes mapped to opacity using `d3.scaleLinear` and labels positioned with a monospace font.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/94983ce82a634487866d7901738b334f?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}