[{"data":1,"prerenderedAt":969},["ShallowReactive",2],{"navigation_docs":3,"-charts-pie-chart":284,"-charts-pie-chart-surround":964},[4,31,117,216],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":30},"Getting Started","i-lucide-rocket","\u002Fgetting-started","1.getting-started",[10,15,20,25],{"title":11,"path":12,"stem":13,"icon":14},"Introduction","\u002Fgetting-started\u002Fintroduction","1.getting-started\u002F1.introduction","i-lucide-house",{"title":16,"path":17,"stem":18,"icon":19},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation","i-lucide-download",{"title":21,"path":22,"stem":23,"icon":24},"Migrate from 0.6","\u002Fgetting-started\u002Fmigration","1.getting-started\u002F3.migration","i-lucide-arrow-up-circle",{"title":26,"path":27,"stem":28,"icon":29},"Why vccs","\u002Fgetting-started\u002Fwhy-vccs","1.getting-started\u002F4.why-vccs","i-lucide-scale",false,{"title":32,"icon":33,"path":34,"stem":35,"children":36,"page":30},"Guides","i-lucide-book-open","\u002Fguides","2.guides",[37,42,47,52,57,62,67,72,77,82,87,92,97,102,107,112],{"title":38,"path":39,"stem":40,"icon":41},"Customize","\u002Fguides\u002Fcustomize","2.guides\u002F01.customize","i-lucide-paintbrush",{"title":43,"path":44,"stem":45,"icon":46},"Axis Domain and Ticks","\u002Fguides\u002Faxis-domain-and-ticks","2.guides\u002F03.axis-domain-and-ticks","i-lucide-ruler",{"title":48,"path":49,"stem":50,"icon":51},"Chart Size","\u002Fguides\u002Fchart-size","2.guides\u002F05.chart-size","i-lucide-maximize",{"title":53,"path":54,"stem":55,"icon":56},"Z-Order and Layers","\u002Fguides\u002Fz-order-and-layers","2.guides\u002F06.z-order-and-layers","i-lucide-layers",{"title":58,"path":59,"stem":60,"icon":61},"Coordinate Systems","\u002Fguides\u002Fcoordinate-systems","2.guides\u002F07.coordinate-systems","i-lucide-crosshair",{"title":63,"path":64,"stem":65,"icon":66},"Performance","\u002Fguides\u002Fperformance","2.guides\u002F08.performance","i-lucide-zap",{"title":68,"path":69,"stem":70,"icon":71},"Rounded Bar Corners","\u002Fguides\u002Frounded-bar-corners","2.guides\u002F09.rounded-bar-corners","i-lucide-square",{"title":73,"path":74,"stem":75,"icon":76},"Bar Alignment","\u002Fguides\u002Fbar-alignment","2.guides\u002F10.bar-alignment","i-lucide-align-center",{"title":78,"path":79,"stem":80,"icon":81},"Nuxt and SSR","\u002Fguides\u002Fnuxt-and-ssr","2.guides\u002F11.nuxt-and-ssr","i-lucide-server",{"title":83,"path":84,"stem":85,"icon":86},"Animation","\u002Fguides\u002Fanimation","2.guides\u002F12.animation","i-lucide-sparkles",{"title":88,"path":89,"stem":90,"icon":91},"Events and v-model","\u002Fguides\u002Fevents-and-models","2.guides\u002F13.events-and-models","i-lucide-mouse-pointer-click",{"title":93,"path":94,"stem":95,"icon":96},"TypeScript","\u002Fguides\u002Ftypescript","2.guides\u002F14.typescript","i-lucide-file-code",{"title":98,"path":99,"stem":100,"icon":101},"Theming and dark mode","\u002Fguides\u002Ftheming","2.guides\u002F15.theming","i-lucide-palette",{"title":103,"path":104,"stem":105,"icon":106},"shadcn-vue","\u002Fguides\u002Fshadcn-vue","2.guides\u002F16.shadcn-vue","i-lucide-component",{"title":108,"path":109,"stem":110,"icon":111},"Dashboard recipes","\u002Fguides\u002Fdashboard-recipes","2.guides\u002F17.dashboard-recipes","i-lucide-layout-dashboard",{"title":113,"path":114,"stem":115,"icon":116},"Accessibility","\u002Fguides\u002Faccessibility","2.guides\u002F18.accessibility","i-lucide-accessibility",{"title":118,"icon":119,"path":120,"stem":121,"children":122,"page":30},"Charts","i-lucide-bar-chart-3","\u002Fcharts","3.charts",[123,128,133,138,143,148,153,158,163,168,172,177,182,187,192,197,202,206,211],{"title":124,"path":125,"stem":126,"icon":127},"Chart Containers","\u002Fcharts\u002Fchart-containers","3.charts\u002F0.chart-containers","i-lucide-box",{"title":129,"path":130,"stem":131,"icon":132},"Area Chart","\u002Fcharts\u002Farea-chart","3.charts\u002F01.area-chart","i-lucide-area-chart",{"title":134,"path":135,"stem":136,"icon":137},"Bar Chart","\u002Fcharts\u002Fbar-chart","3.charts\u002F02.bar-chart","i-lucide-bar-chart",{"title":139,"path":140,"stem":141,"icon":142},"Line Chart","\u002Fcharts\u002Fline-chart","3.charts\u002F03.line-chart","i-lucide-trending-up",{"title":144,"path":145,"stem":146,"icon":147},"Pie Chart","\u002Fcharts\u002Fpie-chart","3.charts\u002F04.pie-chart","i-lucide-pie-chart",{"title":149,"path":150,"stem":151,"icon":152},"Radar Chart","\u002Fcharts\u002Fradar-chart","3.charts\u002F05.radar-chart","i-lucide-radar",{"title":154,"path":155,"stem":156,"icon":157},"Radial Bar Chart","\u002Fcharts\u002Fradial-bar-chart","3.charts\u002F06.radial-bar-chart","i-lucide-circle-dot",{"title":159,"path":160,"stem":161,"icon":162},"Scatter Chart","\u002Fcharts\u002Fscatter-chart","3.charts\u002F07.scatter-chart","i-lucide-scatter-chart",{"title":164,"path":165,"stem":166,"icon":167},"Funnel Chart","\u002Fcharts\u002Ffunnel-chart","3.charts\u002F08.funnel-chart","i-lucide-filter",{"title":169,"path":170,"stem":171,"icon":56},"Composed Chart","\u002Fcharts\u002Fcomposed-chart","3.charts\u002F09.composed-chart",{"title":173,"path":174,"stem":175,"icon":176},"Treemap","\u002Fcharts\u002Ftreemap","3.charts\u002F10.treemap","i-lucide-layout-grid",{"title":178,"path":179,"stem":180,"icon":181},"Sunburst Chart","\u002Fcharts\u002Fsunburst-chart","3.charts\u002F11.sunburst-chart","i-lucide-sun",{"title":183,"path":184,"stem":185,"icon":186},"Sankey","\u002Fcharts\u002Fsankey","3.charts\u002F12.sankey","i-lucide-git-fork",{"title":188,"path":189,"stem":190,"icon":191},"Tracker","\u002Fcharts\u002Ftracker","3.charts\u002F13.tracker","i-lucide-activity",{"title":193,"path":194,"stem":195,"icon":196},"Calendar Heatmap","\u002Fcharts\u002Fcalendar-heatmap","3.charts\u002F14.calendar-heatmap","i-lucide-calendar-days",{"title":198,"path":199,"stem":200,"icon":201},"Heatmap and CohortChart","\u002Fcharts\u002Fheatmap","3.charts\u002F15.heatmap","i-lucide-grid-3x3",{"title":203,"path":204,"stem":205,"icon":142},"Sparkline","\u002Fcharts\u002Fsparkline","3.charts\u002F16.sparkline",{"title":207,"path":208,"stem":209,"icon":210},"Bar List","\u002Fcharts\u002Fbar-list","3.charts\u002F17.bar-list","i-lucide-list-ordered",{"title":212,"path":213,"stem":214,"icon":215},"Journey Sankey","\u002Fcharts\u002Fjourney-sankey","3.charts\u002F18.journey-sankey","i-lucide-split",{"title":217,"icon":218,"path":219,"stem":220,"children":221,"page":30},"Components","i-lucide-code","\u002Fcomponents","4.components",[222,227,232,236,241,245,250,254,259,264,269,274,279],{"title":223,"path":224,"stem":225,"icon":226},"Tooltip","\u002Fcomponents\u002Ftooltip","4.components\u002F01.tooltip","i-lucide-message-square",{"title":228,"path":229,"stem":230,"icon":231},"Legend","\u002Fcomponents\u002Flegend","4.components\u002F02.legend","i-lucide-list",{"title":233,"path":234,"stem":235,"icon":201},"CartesianGrid","\u002Fcomponents\u002Fcartesian-grid","4.components\u002F03.cartesian-grid",{"title":237,"path":238,"stem":239,"icon":240},"Axes","\u002Fcomponents\u002Faxis","4.components\u002F04.axis","i-lucide-move",{"title":242,"path":243,"stem":244,"icon":152},"Polar Axes and Grid","\u002Fcomponents\u002Fpolar-axes","4.components\u002F05.polar-axes",{"title":246,"path":247,"stem":248,"icon":249},"Brush","\u002Fcomponents\u002Fbrush","4.components\u002F06.brush","i-lucide-sliders-horizontal",{"title":251,"path":252,"stem":253,"icon":61},"Reference Elements","\u002Fcomponents\u002Freference-elements","4.components\u002F07.reference-elements",{"title":255,"path":256,"stem":257,"icon":258},"ErrorBar","\u002Fcomponents\u002Ferror-bar","4.components\u002F08.error-bar","i-lucide-chevrons-up-down",{"title":260,"path":261,"stem":262,"icon":263},"Labels and Cell","\u002Fcomponents\u002Flabels","4.components\u002F09.labels","i-lucide-tag",{"title":265,"path":266,"stem":267,"icon":268},"Text","\u002Fcomponents\u002Ftext","4.components\u002F10.text","i-lucide-type",{"title":270,"path":271,"stem":272,"icon":273},"Shapes","\u002Fcomponents\u002Fshapes","4.components\u002F11.shapes","i-lucide-shapes",{"title":275,"path":276,"stem":277,"icon":278},"Composables","\u002Fcomponents\u002Fcomposables","4.components\u002F12.composables","i-lucide-function-square",{"title":280,"path":281,"stem":282,"icon":283},"Custom overlays","\u002Fcomponents\u002Fcustom-overlays","4.components\u002F13.custom-overlays","i-lucide-pencil-ruler",{"id":285,"title":144,"body":286,"description":957,"extension":958,"links":959,"meta":960,"navigation":961,"path":145,"seo":962,"stem":146,"__hash__":963},"docs\u002F3.charts\u002F04.pie-chart.md",{"type":287,"value":288,"toc":946},"minimark",[289,293,298,303,307,315,319,323,329,333,337,348,352,356,367,371,840,867,871],[290,291,292],"p",{},"Pie charts display data as proportional slices of a circle.",[294,295,297],"h2",{"id":296},"simple-pie-chart","Simple Pie Chart",[299,300],"chart-demo",{"description":301,"name":297,"src":302},"A basic pie chart with colored slices.","pie-charts\u002Fsimple-pie-chart",[294,304,306],{"id":305},"donut-chart","Donut Chart",[290,308,309,310,314],{},"Set ",[311,312,313],"code",{},"innerRadius"," to create a donut.",[299,316],{"description":317,"name":306,"src":318},"A pie chart with inner radius creating a donut shape.","pie-charts\u002Fdonut-pie-chart",[294,320,322],{"id":321},"pie-chart-with-labels","Pie Chart with Labels",[290,324,309,325,328],{},[311,326,327],{},":label=\"true\""," to show labels outside each slice.",[299,330],{"description":331,"name":322,"src":332},"A pie chart with value labels on each slice.","pie-charts\u002Flabel-pie-chart",[294,334,336],{"id":335},"half-pie-chart","Half Pie Chart",[290,338,339,340,343,344,347],{},"Use ",[311,341,342],{},"startAngle"," and ",[311,345,346],{},"endAngle"," to create a semicircle.",[299,349],{"description":350,"name":336,"src":351},"A semicircle pie chart using start and end angles.","pie-charts\u002Fhalf-pie-chart",[294,353,355],{"id":354},"piechart-props","PieChart props",[290,357,358,361,362,366],{},[311,359,360],{},"\u003CPieChart>"," takes the ",[363,364,365],"a",{"href":125},"chart container props",", including the polar\nprops. Its tooltip shows one sector at a time.",[294,368,370],{"id":369},"pie-props","Pie props",[372,373,374,393],"table",{},[375,376,377],"thead",{},[378,379,380,384,387,390],"tr",{},[381,382,383],"th",{},"Prop",[381,385,386],{},"Type",[381,388,389],{},"Default",[381,391,392],{},"Description",[394,395,396,416,440,460,484,506,526,545,564,582,599,617,639,658,678,697,717,733,753,772,790,806,823],"tbody",{},[378,397,398,404,407,413],{},[399,400,401],"td",{},[311,402,403],{},"data-key",[399,405,406],{},"row path or accessor",[399,408,409],{},[410,411,412],"strong",{},"required",[399,414,415],{},"Field with the value",[378,417,418,423,425,430],{},[399,419,420],{},[311,421,422],{},"name-key",[399,424,406],{},[399,426,427],{},[311,428,429],{},"'name'",[399,431,432,433,436,437,439],{},"Field with the sector name; a sector without one takes ",[311,434,435],{},"name",", else a string ",[311,438,403],{},", else its row index",[378,441,442,447,452,457],{},[399,443,444],{},[311,445,446],{},"data",[399,448,449],{},[311,450,451],{},"Array",[399,453,454,455],{},"the chart's ",[311,456,446],{},[399,458,459],{},"Rows for this pie",[378,461,462,471,476,481],{},[399,463,464,467,468],{},[311,465,466],{},"cx",", ",[311,469,470],{},"cy",[399,472,473],{},[311,474,475],{},"number | string",[399,477,478],{},[311,479,480],{},"'50%'",[399,482,483],{},"Center",[378,485,486,491,495,500],{},[399,487,488],{},[311,489,490],{},"inner-radius",[399,492,493],{},[311,494,475],{},[399,496,497],{},[311,498,499],{},"0",[399,501,502,503,505],{},"Inner radius; above ",[311,504,499],{}," draws a donut",[378,507,508,513,518,523],{},[399,509,510],{},[311,511,512],{},"outer-radius",[399,514,515],{},[311,516,517],{},"number | string | function",[399,519,520],{},[311,521,522],{},"'80%'",[399,524,525],{},"Outer radius",[378,527,528,533,538,542],{},[399,529,530],{},[311,531,532],{},"start-angle",[399,534,535],{},[311,536,537],{},"number",[399,539,540],{},[311,541,499],{},[399,543,544],{},"Start angle in degrees",[378,546,547,552,556,561],{},[399,548,549],{},[311,550,551],{},"end-angle",[399,553,554],{},[311,555,537],{},[399,557,558],{},[311,559,560],{},"360",[399,562,563],{},"End angle in degrees",[378,565,566,571,575,579],{},[399,567,568],{},[311,569,570],{},"padding-angle",[399,572,573],{},[311,574,537],{},[399,576,577],{},[311,578,499],{},[399,580,581],{},"Gap between sectors in degrees",[378,583,584,589,593,596],{},[399,585,586],{},[311,587,588],{},"corner-radius",[399,590,591],{},[311,592,475],{},[399,594,595],{},"—",[399,597,598],{},"Rounds the corners of every sector, in px",[378,600,601,606,610,614],{},[399,602,603],{},[311,604,605],{},"min-angle",[399,607,608],{},[311,609,537],{},[399,611,612],{},[311,613,499],{},[399,615,616],{},"Minimum sector angle, so small values stay visible",[378,618,619,624,629,632],{},[399,620,621],{},[311,622,623],{},"fill",[399,625,626],{},[311,627,628],{},"string",[399,630,631],{},"series palette per sector",[399,633,634,635,638],{},"Sector fill; ",[311,636,637],{},"\u003CCell>"," sets one sector",[378,640,641,646,650,655],{},[399,642,643],{},[311,644,645],{},"stroke",[399,647,648],{},[311,649,628],{},[399,651,652],{},[311,653,654],{},"'var(--v-charts-background, #fff)'",[399,656,657],{},"Sector outline",[378,659,660,665,670,675],{},[399,661,662],{},[311,663,664],{},"label",[399,666,667],{},[311,668,669],{},"boolean",[399,671,672],{},[311,673,674],{},"false",[399,676,677],{},"Show a label outside every sector",[378,679,680,685,689,694],{},[399,681,682],{},[311,683,684],{},"label-line",[399,686,687],{},[311,688,669],{},[399,690,691],{},[311,692,693],{},"true",[399,695,696],{},"Draw a line from the sector to its label",[378,698,699,704,709,711],{},[399,700,701],{},[311,702,703],{},"active-index",[399,705,706],{},[311,707,708],{},"number | null",[399,710,595],{},[399,712,713,714],{},"Active sector, for ",[311,715,716],{},"v-model:active-index",[378,718,719,723,728,730],{},[399,720,721],{},[311,722,435],{},[399,724,725],{},[311,726,727],{},"string | number",[399,729,595],{},[399,731,732],{},"Series name in the tooltip; legend name of sectors without their own",[378,734,735,740,745,750],{},[399,736,737],{},[311,738,739],{},"legend-type",[399,741,742],{},[311,743,744],{},"LegendType",[399,746,747],{},[311,748,749],{},"'rect'",[399,751,752],{},"Legend icon",[378,754,755,760,765,767],{},[399,756,757],{},[311,758,759],{},"tooltip-type",[399,761,762],{},[311,763,764],{},"'none'",[399,766,595],{},[399,768,309,769,771],{},[311,770,764],{}," to leave the series out of the tooltip",[378,773,774,779,783,787],{},[399,775,776],{},[311,777,778],{},"hide",[399,780,781],{},[311,782,669],{},[399,784,785],{},[311,786,674],{},[399,788,789],{},"Hide the series",[378,791,792,797,801,803],{},[399,793,794],{},[311,795,796],{},"class",[399,798,799],{},[311,800,628],{},[399,802,595],{},[399,804,805],{},"Class on the series layer",[378,807,808,813,817,820],{},[399,809,810],{},[311,811,812],{},"is-animation-active",[399,814,815],{},[311,816,669],{},[399,818,819],{},"the chart's value",[399,821,822],{},"Animate this series",[378,824,825,830,835,837],{},[399,826,827],{},[311,828,829],{},"transition",[399,831,832],{},[311,833,834],{},"ChartTransition",[399,836,819],{},[399,838,839],{},"Timing and easing of data changes",[290,841,842,843,467,846,467,849,852,853,467,856,859,860,467,863,866],{},"Events: ",[311,844,845],{},"@click",[311,847,848],{},"@mouseenter",[311,850,851],{},"@mouseleave"," with ",[311,854,855],{},"(sector, index, event)",[311,857,858],{},"update:activeIndex",", and ",[311,861,862],{},"@animation-start",[311,864,865],{},"@animation-end",".",[294,868,870],{"id":869},"pie-slots","Pie slots",[372,872,873,885],{},[375,874,875],{},[378,876,877,880,883],{},[381,878,879],{},"Slot",[381,881,882],{},"Props",[381,884,392],{},[394,886,887,902,916,931],{},[378,888,889,894,899],{},[399,890,891],{},[311,892,893],{},"#shape",[399,895,896],{},[311,897,898],{},"PieSectorDataItem & { isActive }",[399,900,901],{},"Replace a sector",[378,903,904,909,913],{},[399,905,906],{},[311,907,908],{},"#activeShape",[399,910,911],{},[311,912,898],{},[399,914,915],{},"Replace the active sector",[378,917,918,923,928],{},[399,919,920],{},[311,921,922],{},"#label",[399,924,925],{},[311,926,927],{},"PieSectorDataItem & { index }",[399,929,930],{},"Replace a sector label",[378,932,933,936,938],{},[399,934,935],{},"default",[399,937,595],{},[399,939,940,942,943],{},[311,941,637],{}," for per-sector colors, ",[311,944,945],{},"\u003CLabelList>",{"title":947,"searchDepth":948,"depth":948,"links":949},"",2,[950,951,952,953,954,955,956],{"id":296,"depth":948,"text":297},{"id":305,"depth":948,"text":306},{"id":321,"depth":948,"text":322},{"id":335,"depth":948,"text":336},{"id":354,"depth":948,"text":355},{"id":369,"depth":948,"text":370},{"id":869,"depth":948,"text":870},"Build pie and donut charts for part-to-whole comparisons","md",null,{},{"icon":147},{"title":144,"description":957},"f8SaPfItFsZBKF8cKNL-H1ucaVi0ybMYEytUETPeNFE",[965,967],{"title":139,"path":140,"stem":141,"description":966,"icon":142,"children":-1},"Build line charts with custom dots, labels, and multiple series",{"title":149,"path":150,"stem":151,"description":968,"icon":152,"children":-1},"Build radar charts for multi-dimensional data comparison",1793527168020]