Increase Quality of saved images

[isaac Cragg]

Hello, 

please could you advise me on how to increase the quality of the saved chart images and remove the black line?

kind regards, 

Isaac

(I have attached a current image)

Attachment: Image_c3152cc6.zip

[Devakumar Dhanapoosanam]

Hi Isaac Cragg, 

 

We have analyzed the reported query and we can resolve the black line in the saved chart image by adding SfChart parent as a Grid and export the SfChart parent to image directly and save the image file type based on your requirement. Also, we can improve image quality by passing the scale width and height in RenderAsync method as per in the below code example. 

 

<Grid x:Name="grid" Background="White" 

      Padding="5"> 

    <chart:SfChart x:Name="chart" Background="White"> 

        <chart:SfChart.PrimaryAxis> 

            <chart:NumericalAxis x:Name="xAxis" Header="Displacement(mm)" 

                                 EdgeLabelsDrawingMode="Shift"/> 

        </chart:SfChart.PrimaryAxis>
        ….
    </chart:SfChart> 

</Grid> 

 

private async void Save() 

{ 

    var renderTargetBitmap = new RenderTargetBitmap(); 

    //improve the image quality by scaling width and height 

    await renderTargetBitmap.RenderAsync(grid, (int)chart.ActualWidth, (int)chart.ActualHeight); 

    var pixels = await renderTargetBitmap.GetPixelsAsync(); 

 

    var fileSavePicker = new FileSavePicker(); 

    fileSavePicker.FileTypeChoices.Add("PNG", new List<string>() { ".png" }); 

    fileSavePicker.FileTypeChoices.Add("JPG", new List<string>() { ".jpg" }); 

    fileSavePicker.FileTypeChoices.Add("BMP", new List<string>() { ".bmp" }); 

    fileSavePicker.FileTypeChoices.Add("GIF", new List<string>() { ".gif" }); 

    fileSavePicker.FileTypeChoices.Add("JPG-XR", new List<string>() { ".jxr" }); 

    fileSavePicker.FileTypeChoices.Add("TIFF", new List<string>() { ".tiff" }); 

    fileSavePicker.SuggestedFileName = SfChartResourceWrapper.FileName; 

 

    var file = await fileSavePicker.PickSaveFileAsync(); 

    if (file != null) 

    { 

        Guid encoderId = GetBitmapEncoderId(file.FileType); 

        using (var stream = await file.OpenAsync(Windows.Storage.FileAccessMode.ReadWrite)) 

        { 

            var encoder = await BitmapEncoder.CreateAsync(encoderId, stream); 

            encoder.SetPixelData(BitmapPixelFormat.Bgra8, BitmapAlphaMode.Ignore, (uint)renderTargetBitmap.PixelWidth, 

                (uint)renderTargetBitmap.PixelHeight, 96, 96, pixels.ToArray()); 

            await encoder.FlushAsync(); 

        } 

    } 

} 

 

Output: 

 

Sample: https://www.syncfusion.com/downloads/support/forum/171692/ze/171692-1635780187.zip  

 

Please let us know if you need any further assistance on this. 

 

Regards, 

Devakumar D