Resizing Donut Chart

[Steve]

We are using the example chart at the moment trying to resize the donut,  The doc say use seriesdefault.holeSize  holeSize does not exists

The difference between the example code and others is

 

Example code

.SeriesDefaults(series => series.Donut()
.StartAngle(150)

 

Telerik Support code

seriesDefaults: {
     holeSize: 20,

 

so using the example code below what's the way to resize the chart,  also, Id like to know how to add values to the donut to show what value the % come from.

 

Thanks in advance

Example code used

<div class="demo-section k-content wide">
@(Html.Kendo().Chart()
.Name("EventPriorityGraph")
.ChartArea(chartArea => chartArea
.Background("transparent")
// .Width(200)
// .Height(200)
)
.Title(title => title
.Text("Events by priority")
.Position(ChartTitlePosition.Bottom)
)
.Legend(legend => legend
.Visible(false)
)
.SeriesDefaults(series => series.Donut()
.StartAngle(150)

)
.Series(series =>
{
series.Donut(new dynamic[] {
new {category = "P1",value = 0,color = "#ADC9D5"},
new {category = "P2",value = 0,color = "#5FCBFF"},
new {category = "P3",value = 0,color = "#49B4E7"},
new {category = "P4",value = 0,color = "#00689B"},
new {category = "Unknown",value = 100,color = "#002D42"},
})
.Name("2014");

series.Donut(new dynamic[] {
new {category = "P1",value = 1.72,color = "#ADC9D5"},
new {category = "P2",value = 3.41,color = "#5FCBFF"},
new {category = "P3",value = 17.45,color = "#49B4E7"},
new {category = "P4",value = 73.56,color = "#00689B"},
new {category = "Unknown",value = 3.83,color = "#002D42"},
})
.Name("2015");
series.Donut(new dynamic[] {
new {category = "P1",value = 1.61,color = "#ADC9D5"},
new {category = "P2",value = 2.51,color = "#5FCBFF"},
new {category = "P3",value = 16.247,color = "#49B4E7"},
new {category = "P4",value = 75.35,color = "#00689B"},
new {category = "Unknown",value = 4.26,color = "#002D42"},
})
.Name("2016")
.Labels(labels => labels
.Visible(true)
.Position(ChartPieLabelsPosition.OutsideEnd)
.Template("#= category #: \n #= value#%")
.Background("transparent")
);
})
.Tooltip(tooltip => tooltip
.Visible(true)
.Template("#= category # (#= series.name #): #= value #%")
)
)
</div>

[Iliana Dyankova]

Hi Steve,

Thank you for pointed that the seriesDefaults.holeSize option is missing in the Chart MVC wrapper - I forwarded it to the developers for fixing. Meanwhile, you could set the holeSize in the series configuration:

//....
.Series(series => {
   //....
})
.HoleSize(100)
.Name("2014");

Regarding your other question - "...Id like to know how to add values to the donut to show what value the % come from....", I am not quite sure if I understand it correctly. Could you please elaborate a bit more?

Regards,
Iliana Nikolova
Telerik

 

 

[Steve]

Hi, Thanks, I have tried that and I receive the error
ChartPieSeriesBuilder <object> does not contain the definition for HOLESIZE accepting the first argument of type ChartPieSeriesBuilder <object>

I get this error in all places I try to add holesize,  including the position you told me.

Thanks

 

Cameron

[Iliana Dyankova]

Hi Cameron,

I am not quite sure why this option does not work in your project. Could you please provide an isolated runnable example which I could test locally - this way I would be able to check what exactly is going wrong and provide concrete recommendations?

Regards,
Iliana Nikolova
Telerik