Positioning LabelText on Donut Chart

[Mozart]

Hi,

I want to set my Label Text next to LabelLine on Donut Chart.

i use this code to create my chart, but somehow the label text placed on top of label line, not next to it (see attachment for my desired result)

 

Thank you in advance

 

private void CreateRadChartDonut(ref string p_strFileName)
        {
            RadChartView chartDonut = new RadChartView();
            //chartDonut = radChartView1;
            chartDonut.Size = radChartView1.Size;
            chartDonut.Dock = DockStyle.Fill;
            chartDonut.LabelFormatting += radChartView_LabelFormatting;

            chartDonut.View.Margin = new Padding(65); //set pie padding
            chartDonut.AreaType = ChartAreaType.Pie; //set to pie chart type
            chartDonut.Series.Clear();

            #region Config New Chart Series
            Telerik.WinControls.UI.DonutSeries smartPie = new Telerik.WinControls.UI.DonutSeries();
            smartPie.Name = "Series";
            smartPie.InnerRadiusFactor = 0.35f; //setting inner radious doughnut so it can change as Doughnut Chart
            smartPie.LabelMode = PieLabelModes.Horizontal;
            smartPie.ShowLabels = true; //show label text
            smartPie.DrawLinesToLabels = true; //show label line connector
            smartPie.LinesToLabelsColor = Color.FromArgb(197, 158, 115); //set label line connector color
            smartPie.SyncLinesToLabelsColor = false; //set true if we want to set label line color the same as series color

            //set angle range starting position
            AngleRange range = smartPie.Range;
            range.StartAngle = 250;
            smartPie.Range = range;
            smartPie.LabelsOffsetFromCenter = 1.56f;

            #endregion

            #region Generate Data
            List<DataChart> lData = new List<DataChart>();
            lData.Add(new DataChart("Savings", 50));
            lData.Add(new DataChart("Deposit", 25));
            lData.Add(new DataChart("BancaAssurance", 12.5));
            lData.Add(new DataChart("MutualFund", 12.5));
            #endregion

            //add slice area
            foreach (DataChart d in lData)
            {
                PieDataPoint point = new PieDataPoint(Convert.ToDouble(d.Value), d.Name);
                point.Label = d.Name.ToUpper();
                point.Label = string.Format("{0} | {1}%{2}{3} {4}", d.Name.ToUpper(), d.Value, Environment.NewLine, "IDR", Convert.ToDouble(d.ValueRp).ToString("N0"));
                smartPie.DataPoints.Add(point);
            }
            chartDonut.Series.Add(smartPie);

            #region Setting Series Slice Color
            chartDonut.Series[0].Children[0].BackColor = Color.FromArgb(193, 152, 105);
            chartDonut.Series[0].Children[1].BackColor = Color.FromArgb(207, 175, 140);
            chartDonut.Series[0].Children[2].BackColor = Color.FromArgb(221, 198, 173);
            chartDonut.Series[0].Children[3].BackColor = Color.FromArgb(235, 221, 206);
            chartDonut.Series[0].IsVisible = true;
            #endregion

            ExportChart(ref p_strFileName, chartDonut, new Size(690, 360));
        }

[Mozart]

Code to label formatting & Export

private void radChartView_LabelFormatting(object sender, ChartViewLabelFormattingEventArgs e)
        {
            e.LabelElement.BackColor = Color.White;
            e.LabelElement.ForeColor = Color.FromArgb(193, 141, 88);
            e.LabelElement.Font = lblFontBold;
            //e.LabelElement.TextAlignment = ContentAlignment.MiddleLeft;
            PointLabelElement pointLabel = e.LabelElement as PointLabelElement;
            if (pointLabel != null)
            {
                pointLabel.PositionOffset = new PointF(-10, 0);
                pointLabel.DataPointElement.PointSize = new SizeF(10, 10);
            }
        }

private void ExportChart(ref string p_strFileName, RadChartView p_oRadChart, Size p_oSize)
        {
            if (File.Exists(p_strFileName))
            {
                p_strFileName = Path.Combine(Path.GetDirectoryName(Application.ExecutablePath), "temp_" + DateTime.Now.Ticks.ToString().Replace(":", "_") + ".tiff");
            }
            p_oRadChart.ExportToImage(p_strFileName, p_oSize, System.Drawing.Imaging.ImageFormat.Tiff);

            Thread.Sleep(3); //sleep thread for 3 milisecond to avoid GDI error
        }

 

[Mozart]

Nevermind, i made it work with setting ShowSmartLabels = True

[Dess | Tech Support Engineer, Principal]

Hi, Mozart,

I am glad that the problem you were facing is now resolved. Indeed, the smart labels that RadChartView offers is a suitable built-in mechanism for resolving labels overlapping. It will optimize the arrangement of the labels in a way that there will be less overlaps.

RadChartView’s SmartLabelsController uses strategies specific to different chart types to resolve label overlaps. Additional information on this topic can be found in the following help article: https://docs.telerik.com/devtools/winforms/controls/chartview/features/smart-labels 

I hope this information helps. If you need any further assistance please don't hesitate to contact me. 

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik