{"version":"1.0","type":"rich","title":"Fork of Placing text within a arc year calendar","description":"This example shows a donut chart displaying twelve months of the year as colored arcs, with month names placed along the curved paths of the arcs. The code uses D3.js v3 with d3.svg.arc and d3.layout.pie to generate the chart, while d3.scale.linear with d3.interpolateHcl creates a color gradient from blue to dark teal. Labels are positioned using SVG textPath elements along invisible arcs, with a JavaScript conditional that flips the arc direction for labels below the horizontal midpoint so they read upright. The chart uses placeholder data with each month having a value of 12, rendered as an SVG in a React context.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/d40ffa96a0aa49a88e17070a30f473a4?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}