.net – Live Charts in VB.Net: Corrupted image conversion of charts or charts in panels


Converting a panel or a graph directly into bitmap then to image, results in corrupted and cropped images.

I first tried converting the panel with the chart in it to image

Function ConvertPanelToITextSharpImage(panel As Guna2Panel) As iTextSharp.text.Image

    Dim bmp As New Bitmap(panel.Width, panel.Height)
    panel.DrawToBitmap(bmp, New Rectangle(0, 0, panel.Width, panel.Height))

     Using ms As New MemoryStream()
         bmp.Save(ms, System.Drawing.Imaging.ImageFormat.Png)
         Dim byteArray As Byte() = ms.ToArray()
         Dim iTextSharpImage As iTextSharp.text.Image = iTextSharp.text.Image.GetInstance(byteArray)
         Return iTextSharpImage
     End Using

End Function

I will then add it to a PdfPTable to be later saved along with other stuff in a pdf file

Dim chartTable As New PdfPTable(1) With {
    .HorizontalAlignment = Element.ALIGN_CENTER,
    .SpacingBefore = 40,
    .SpacingAfter = 20
}

Dim chartsImage As Image = ConvertCartesianChartToImage(ReportCountPanel)
chartTable.AddCell(chartsImage)

After saving the pdf file, it will later look like this in the pdf file:

Corrupted and Cropped Chart Image

But It should look like this:

What it is suppose to look like (the point is, this image is not cropped)

I also tried invalidating, updating, using Threading.Thread.Sleep(1000) so that the chart would perfectly render before converting it to an image, I also tried suspending the chart or the panel then resume it afterwards after converting it to an image, I also tried converting the CHART itself, sort of like the function earlier but with Winforms.Cartesian chart as its arguments:

Function ConvertPanelToITextSharpImage(chart As Winforms.CartesianChart) As iTextSharp.text.Image

I also tried converting other panels to images and it seems to work just fine, so I tried to use other panels with other types of charts in it, and it was also cropped and corrupted, I also tried putting the panel with the chart in it, inside of another panel and then capture that whole panel and out of all the controls inside of that panel, only the chart is corrupted and cropped.

Converted Image of the panel of the chart inside of another panel with other controls

The weird thing is, I tried to adjust the size of the chart in the panel, and converted that panel to an image and then the chart looks just fine, it’s not cropped or anything but it looks very extraordinary:

Resized chart but same size panel

Then I tried another method that would just straight up screenshot the chart on my screen and then convert that screenshot to an image, here’s the code:

Private Function ConvertCartesianChartToImage(chart As Guna2Panel) As iTextSharp.text.Image

    Dim screencapture As Bitmap
    Dim graph As Graphics

    screencapture = New Bitmap(chart.Width, chart.Height, Imaging.PixelFormat.Format32bppArgb)
    graph = Graphics.FromImage(screencapture)
    graph.Clear(Color.White)
    graph.SmoothingMode = Drawing2D.SmoothingMode.AntiAlias
    graph.CompositingQuality = Drawing2D.CompositingQuality.HighQuality
    graph.CopyFromScreen(chart.Bounds.X, chart.Bounds.Y, 0, 0, chart.Size, CopyPixelOperation.SourceCopy)

    Using MS As New MemoryStream()
        screencapture.Save(MS, System.Drawing.Imaging.ImageFormat.Png)
        MS.Position = 0
        Dim byteArray As Byte() = MS.ToArray()
        Dim iTextSharpImage As iTextSharp.text.Image = iTextSharp.text.Image.GetInstance(byteArray)
        Return iTextSharpImage
    End Using

End Function

I specifically need to use the X and Y axis location of the panel containing the chart panel in my form because it is taking a screenshot of my whole screen, and here is the image:
Converted image of screenshot of chart

Now it seems that this is the very solution to my problem, but I personally that taking a screenshot is actually kind of “unsanitary” or something, it just feels weird, plus, there is this problem on other computers that arises:

Screenshot image of the chart but with something else in it? A photobomber?

That is it, please if you guys ever encountered a problem like this, I would like to know what to do, I’ve been scratching my head since yesterday, I’ve created hundreds of pdf files just to debug this feature out 😭🤣

Anyways, thanks in advance for responding, I really appreciate it!

Leave a Reply

Your email address will not be published. Required fields are marked *