Export Chart as Image or Stream

[Thomas OMER-DECUGIS]

Hi,

I try to share the Chart in my application.

Could someone provide me an example of how to export a chart as an image or a stream, in an Universal App ?

Thank you in advance for any help you can give me.

Regards,

TOD

[Thomas OMER-DECUGIS]

Hi all,

i finally found a way to save my chart as an image (see below), but i can't find an event to call my function at the right time...

I would like to make the capture of the graph when it redraws, or when the animation is over, but not on the click of a button.

I tried :

- LayoutUpdated but it fires too often,  and even when the chart is not visible on the screen ??

- Loaded, but it fires too soon and the series are not yet drawn.

- Unloaded, but it never fires ??

I really need help, please.

For those who needs to save Chart as an Image in an Universal App, the snippet below works, for example on a button click :

 private async void SaveImage()

          {

              //Rendu du composant Xaml, ici le graphique 'Syncfusion.Chart', sous forme d'image en mémoire.

              RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();

              await renderTargetBitmap.RenderAsync(doughnutMadelin, (int)myDoughnutActualWidth, (int)myDoughnut.ActualHeight);

              var pixelBuffer = await renderTargetBitmap.GetPixelsAsync();

              //var localFolder = Windows.Storage.ApplicationData.Current.LocalFolder;

              var localFolder = Windows.ApplicationModel.Package.Current.InstalledLocation;

              var saveFile = await localFolder.CreateFileAsync("Chart.png", Windows.Storage.CreationCollisionOption.OpenIfExists);

              // Encodage de l'image en mémoire dans le fichier désigné sur le disque

              using (var fileStream = await saveFile.OpenAsync(Windows.Storage.FileAccessMode.ReadWrite))

              {

                  var encoder = await BitmapEncoder.CreateAsync(BitmapEncoder.PngEncoderId, fileStream);

                  encoder.SetPixelData(

                      BitmapPixelFormat.Bgra8,

                      BitmapAlphaMode.Ignore,

                      (uint)renderTargetBitmap.PixelWidth,

                      (uint)renderTargetBitmap.PixelHeight,

                      DisplayInformation.GetForCurrentView().LogicalDpi,

                      DisplayInformation.GetForCurrentView().LogicalDpi,

                      pixelBuffer.ToArray());

                  await encoder.FlushAsync();

              }

          }

Regards,

TOD

[Muneesh Kumar G]

Hi Tod,

Thanks for using Syncfusion products.

We can achieve your requirement in loaded event by using Dispatcher as per the following code example.

Code Snippet[ C#]:
async void Performance_Loaded(object sender, RoutedEventArgs e)
{
await this.Dispatcher.RunAsync(CoreDispatcherPriority.Normal, new DispatchedHandler(() =>
{
SaveImage();
}));

}

We have prepared a sample based on this and you can find the sample under the following location:

Sample : http://www.syncfusion.com/downloads/support/forum/120283/ze/Export_SfChart699489350

Please let us know if you have any queries.

Regards,

Muneesh Kumar G.

[Thomas OMER-DECUGIS]

Hello Muneesh Kumar,

i tried your suggestion, but it doesn't work. I experiment the same behavior as before.

The "Loaded" event fires several times : i suspect that is because my chart is in a userControl which is use several times in differents VisualStates.

However, if I filter the event "Loaded" on the right VisualState, I get the picture attached, which is largely black.

It seems that the event fires before the animation of the Doughnut: How to detect that the animation is over?

Regards,

Thomas OD

Attachment: CaptureChart_Err1_d8b7c6a8.zip

[Rachel A]

Hi Thomas,
 
Thanks for the update.
 
We can resolve this issue by making the thread to wait asynchronously like the following code example,
 

[C#]
       async void Performance_Loaded(object sender, RoutedEventArgs e)
        {
            await Task.Delay(TimeSpan.FromSeconds(5));
                await this.Dispatcher.RunAsync(CoreDispatcherPriority.Low, new DispatchedHandler(() =>
                {
                    SaveImage();
                }));
            this.Loaded -= Performance_Loaded;
 
        }

 
We have prepared the sample for your reference that you can download from here.
 
Sample: export
 
Note: Currently we don’t have the events support to detect whether the animation is completed.
 
Regards,
Rachel. A

[Thomas OMER-DECUGIS]

Thank you Rachel.

your solution is not perfect, but it helped me to implement a workaround.

Let me know if new events around the rendering of a chart are implemented.

Thank you again.

Regards,

Thomas OD

[Rachel A]

Hi Thomas,
 
Thanks for the update.
 
We will not be able to identify exactly the completion of chart rendering (not only chart, any UI elements). Since rendering purely depends on system environment. We are analyzing the feasibility for considering requirement for indicate once all the work in chart completes and given the chart for rendering cycle. And this scenario also, not assure to be invoked exactly rendering completes (i.e., UI elements displayed completely in window).

Regards,
Rachel. A