We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to render chart image run-time and save it to a file?

Thread ID:





128915 Feb 15,2017 02:48 PM UTC Mar 2,2017 01:49 PM UTC ASP.NET Core 5
Tags: Chart
Stanislaw Tristan
Asked On February 15, 2017 02:48 PM UTC

I need to save the rendered chart image to a PNG file without displaying it to UI.
How this is possible?

Dharanidharan Dharmasivam [Syncfusion]
Replied On February 17, 2017 12:52 PM UTC

Hi Stanislaw, 

Thanks for using Syncfusion product. 

We have analyzed your query and prepared a sample with respect to your requirement. In a button click, we have exported chart as image. In this, we can specify the export settings properties and called the export method. In the server side, we have exported to specified folder. In the highlighted path, you can specify your required path, in which the chart has to be saved as image. Find the code snippet below. 

ASP.NET Core: 

<input type="button" value="PNG" onclick="chartPng()" /> 
function chartPng(sender) { 
        var chart = $("#container").ejChart("instance"), 
            exporting = chart.model.exportSettings; 
        exporting.fileName = "chart"; 
        exporting.angle = 0; 
        exporting.action = "Home/ExportChart"; 
        type = "png"; 
        exporting.mode = "server"; 
static string path = "E:\\"; 
public void ExportChart(string Data, string ChartModel) 
            ChartProperties obj = ConvertChartObject(ChartModel); 
            string type = obj.ExportSettings.Type.ToString().ToLower(); 
            string fileName = obj.ExportSettings.FileName; 
            string orientation = obj.ExportSettings.Orientation.ToString(); 
            Data = Data.Remove(0, Data.IndexOf(',') + 1); 
            MemoryStream stream = new MemoryStream(Convert.FromBase64String(Data)); 
            using (FileStream fs = new FileStream(path + "CoreChart.png", FileMode.Create)) 
                using (BinaryWriter bw = new BinaryWriter(fs)) 
                    byte[] data = Convert.FromBase64String(Data); 

We have attached the sample for your reference in the below location. 


Stanislaw Tristan
Replied On February 17, 2017 01:20 PM UTC

Hello, Dharani!
Thank you for the solution and sample!

Anandaraj T [Syncfusion]
Replied On February 20, 2017 12:02 PM UTC

Hi Stanislaw, 

Most welcome. 

Please let us know if you have any other queries regarding this. We are glad to assist you. 


Stanislaw Tristan
Replied On February 28, 2017 12:24 PM UTC

Your sample contains with both server and client code. But I need to export chart completely from server-side.
Your method ExportChart accepts a parameter Data, that comes from client. How to make this sample without touching the client (i.e. get the Data from server-side).
Thank you!

Dharanidharan Dharmasivam [Syncfusion]
Replied On March 2, 2017 01:49 PM UTC

Hi Stanislaw, 

Sorry for the inconvenience. 

As of now we don’t have support for exporting chart completely in server side. To export the chart we need to call the public method (named export). In this method we will fetch the rendered chart element from the DOM and we will convert the canvas element into DataURL and will send this data to the server side. Since these process have to be carried out in client side only, exporting chart completely in server side is not possible. 



This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon