Chart view image export doesn't work correctly

3 posts, 0 answers
  1. Kseniia
    Kseniia avatar
    2 posts
    Member since:
    Jan 2017

    Posted 31 Jan 2017 Link to this post

     Hi,

    Picture exported in wrong size to picture.image when creating RadChartView in AchiverReports10. Picture is cropped when adding Legend Title. Could you help me please in this question?

     Private Sub GroupFooter1_Format(sender As Object, e As EventArgs) Handles GroupFooter1.Format
          Dim rchv As New RadChartView
          rchv.Name = "rchv"
          rchv.ShowTitle = True
          rchv.Title = "Test"
          rchv.ChartElement.TitleElement.Font = New Font("Arial", 16)
          rchv.ShowToolTip = True
          rchv.ShowLegend = False
          rchv.Area.View.Palette = KnownPalette.Metro

          AddHandler rchv.LabelFormatting, AddressOf rcvQualityPie_LabelFormatting
          
          rchv.Series.Clear()
          rchv.AreaType = ChartAreaType.Pie
          rchv.ChartElement.AutoSize = True
          rchv.ShowSmartLabels = True
          rchv.ShowLegend = False

          Dim series As New PieSeries()

          For Each row As DataRow In _dtRejctResons.Rows
             series.DataPoints.Add(New Telerik.Charting.PieDataPoint(row("OsuusPerc"), row("RaakkiSelite")))
          Next

          series.DrawLinesToLabels = True
          series.SyncLinesToLabelsColor = True
          series.ShowLabels = True

          rchv.Series.Add(series)

          Dim sFileName As String = "exprtedChart1.png"
          Dim sFilePath As String

          sFilePath = System.IO.Path.GetTempPath & sFileName

          If File.Exists(sFilePath) = True Then
             File.Delete(sFilePath)
          End If
          rchv.ExportToImage(sFilePath, rchv.Size, System.Drawing.Imaging.ImageFormat.Png)
          Picture.Image = Image.FromFile(sFilePath)

    End Sub

    Private Sub rcvQualityPie_LabelFormatting(sender As Object, e As ChartViewLabelFormattingEventArgs)
          Dim pieElement As PiePointElement = DirectCast(e.LabelElement.Parent, PiePointElement)
          Dim dataPoint As PieDataPoint = DirectCast(pieElement.DataPoint, PieDataPoint)
          e.LabelElement.BackColor = Color.White
          e.LabelElement.BorderColor = Color.White
          e.LabelElement.Text = String.Format("{0}, " & "{1} %", dataPoint.LegendTitle, Math.Round(dataPoint.Percent, 0))
          e.LabelElement.Padding = New System.Windows.Forms.Padding(6, 0, -100, 0)

       End Sub

  2. Hristo
    Admin
    Hristo avatar
    1519 posts

    Posted 31 Jan 2017 Link to this post

    Hi Kseniia,

    Thank you for writing.

    From your code snippet, I see that you are handling the LabelFormatting event and assigning a padding which results in the cropped chart. The proper approach to position the labels in relation to the chart is to use the DistanceToLabel property of the PieTwoLabelColumnsStrategy class. Please check my code snippet below: 
    Public Class Form1
        Sub New()
     
            InitializeComponent()
     
            rchv.Name = "rchv"
            rchv.ShowTitle = True
            rchv.Title = "Test"
            rchv.ChartElement.TitleElement.Font = New Font("Arial", 16)
            rchv.ShowToolTip = True
            rchv.ShowLegend = False
            rchv.Area.View.Palette = KnownPalette.Metro
     
            AddHandler rchv.LabelFormatting, AddressOf rcvQualityPie_LabelFormatting
     
            rchv.Series.Clear()
            rchv.AreaType = ChartAreaType.Pie
     
            Dim smartLabelController = New SmartLabelsController()
            Dim strategy As New PieTwoLabelColumnsStrategy()
            strategy.DistanceToLabel = -40
            smartLabelController.Strategy = strategy
     
            rchv.Controllers.Add(smartLabelController)
            rchv.ShowLegend = False
     
            Dim series As New PieSeries()
            series.DataPoints.Add(New PieDataPoint(50, "Germany"))
            series.DataPoints.Add(New PieDataPoint(70, "United States"))
            series.DataPoints.Add(New PieDataPoint(40, "France"))
            series.DataPoints.Add(New PieDataPoint(25, "United Kingdom"))
     
            series.DrawLinesToLabels = True
            series.SyncLinesToLabelsColor = True
            series.ShowLabels = True
     
            rchv.Series.Add(series)
        End Sub
     
        Private Sub rcvQualityPie_LabelFormatting(sender As Object, e As ChartViewLabelFormattingEventArgs)
            Dim pieElement As PiePointElement = DirectCast(e.LabelElement.Parent, PiePointElement)
            Dim dataPoint As PieDataPoint = DirectCast(pieElement.DataPoint, PieDataPoint)
            e.LabelElement.BackColor = Color.White
            e.LabelElement.BorderColor = Color.White
            e.LabelElement.Text = String.Format("{0}, " & "{1} %", dataPoint.LegendTitle, Math.Round(dataPoint.Percent, 0))
     
        End Sub
     
        Private Sub RadButton1_Click(sender As Object, e As EventArgs) Handles RadButton1.Click
            Dim sFilePath As String = "..\..\exported.png"
            rchv.ExportToImage(sFilePath, rchv.Size, System.Drawing.Imaging.ImageFormat.Png)
            PictureBox1.Image = Image.FromFile(sFilePath)
        End Sub
    End Class

    I am also attaching a short video showing the result on my end.

    I hope this helps. Should you have further questions please do not hesitate to write back.

    Regards,
    Hristo
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Kseniia
    Kseniia avatar
    2 posts
    Member since:
    Jan 2017

    Posted 01 Feb 2017 in reply to Hristo Link to this post

    Hi Hristo,

    Thank you for your help!

Back to Top