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.
Unfortunately, activation email could not send to your email. Please try again.

How to put the chart in the generated PDF document?

Thread ID:

Created:

Updated:

Platform:

Replies:

119103 May 11,2015 04:40 AM May 23,2015 03:09 AM ASP.NET MVC 5
loading
Tags: Chart
RobertS
Asked On May 11, 2015 04:40 AM

Hi,

The pdf document generated by the controller need to embed a radar chart type. 
The document will be generated on the page that does not have an embedded chart.
How do I accomplish this by using the SyncFusion library ?

Regards,
RobertS

Vinothkumar Arumugam [Syncfusion]
Replied On May 12, 2015 09:21 AM

Hi Robert,

We have analyzed this. Currently there is no support to embed[export] chart as PDF file. So we have already logged an feature request for this “Support to export chart as PDF”. A support incident to track the status of this feature has been created under your account. Please log on to our support website to check for further updates

https://www.syncfusion.com/account/login?ReturnUrl=%2fsupport%2fdirecttrac%2fincidents

Please let us know if you have any concern.

Thanks,

Vinothkumar Arumugam.



RobertS
Replied On May 12, 2015 06:20 PM

Hi,

Can I hope that chart will be one of the elements that will be rendered in a pdf document?

Regards,
RobertS

Vinothkumar Arumugam [Syncfusion]
Replied On May 13, 2015 09:36 AM

Hi Robert,

We have analyzed your query. We can’t render chart in pdf as of now but as a work around, we can able to save chart in pdf .you can achieve your requirements by applying following code snippet.

Code Snippet [MVC]:Index.chhtml

· Create a form to send an image to server as below

var canvas = document.getElementById('container_canvas');

var image = canvas.toDataURL("image/png");

var form = CreateElement('form', ["method", "action", "style"], ["post", "/ChartExportService.asmx/SaveChart", "display:hidden;"]);

var file = CreateElement("input", ["type", "name", "value"], ["hidden", "data", image]);

var format = CreateElement("input", ["type", "name", "value"], ["hidden", "format","PDF"]);

form.appendChild(file);

form.appendChild(format);

document.body.appendChild(form);

form.submit();

document.body.removeChild(form);

· Create the Pdf and save the image .

PdfDocument pdfDoc = new PdfDocument();

pdfDoc.Pages.Add();

pdfDoc.Pages[0].Graphics.DrawImage(PdfImage.FromStream(stream), new PointF(10, 30));

pdfDoc.Save(Response.OutputStream);

pdfDoc.Close();

Screenshot:

We have prepared a sample based on your requirements .You can download it from below link.

Sample Link:
WebApplication1.zip

Please let us know if you have any concern.

Thanks,

Vinothkumar Arumugam.


Dnyani
Replied On May 22, 2015 03:01 AM

hi Vinothkumar ,
Can I put chart as an image on pdf if yes then please give sample example for xamrin.forms android.


Vinothkumar Arumugam [Syncfusion]
Replied On May 23, 2015 03:09 AM

Hi Dnyani,

We have analyzed your query, Chart image render in PDF by using Syncfusion PDF control.

Find the below steps to export chart image to PDF:

Steps to export chart image:

I. Applying following code snippet to export and download the chart image as below.

if (document.getElementById('download').addEventListener)

document.getElementById('download').addEventListener('click', download, false);

else

document.getElementById('download').attachEvent('click', download, false);

function download() {

var canvas = $("#container").ejChart("exportChart");

var dt = canvas.toDataURL();

this.rel='nofollow' href = dt;

}

II. Run the sample

III. Click on Export image

4. Save image to your specified folder location with name Chart. This location needed for PDF generator.

Image saved in below location

Location: F:\2015Volume\Support\Incident\Samples\MVC\22.5.2015\WebApplication1\WebApplication1\exportchartImage\Chart.png

Once above steps completed.

5. Steps to Render chart image in PDF

I. Referring DLL’s

Syncfusion.Pdf.Base.dll

II. Applying following code snippet to post view control to HomeController

function ExportChart(sender) {

var string = "post image to controller";

$.ajax({

type: "POST",

url: "Home/DATACRUD",

data: JSON.stringify({ "XmlParms": string }),

contentType: "application/json; charset=utf-8",

dataType: "json",

async: false,

success: function (r) {

alert("success")

},

error: function (r) {

alert("failure")

}

});

}

III. Load chart image into the PDF document

//Using following namespaces

using Syncfusion.Pdf;

using Syncfusion.Pdf.Graphics;

//Put your pdf document here

PdfLoadedDocument loaded = new PdfLoadedDocument(@"F:\2015Volume\Support\Incident\Samples\MVC\22.5.2015\WebApplication1\WebApplication1\OutputPdf\pdfDocument.pdf");

//Specied your downloaded chart image location

PdfImage image = PdfImage.FromFile( @"F:\2015Volume\Support\Incident\Samples\MVC\22.5.2015\WebApplication1\WebApplication1\exportchartImage\Chart.png");

//Specify in which page loacation to your chart image render in PDF.

//In RectangleF first two parameters represent starting position of the Image(x,y),and next two parameters represent width and hight of the Image.

loaded.Pages[0].Graphics.DrawImage(image, new RectangleF(0, 0, 500, 900));

//The Resultant document saved below loaction. loaded.Save(@"F:\2015Volume\Support\Incident\Samples\MVC\22.5.2015\WebApplication1\WebApplication1\OutputPdf\pdfDocument.pdf");

Screen Shots:

Click on PDF button .Ajax post the button control to HomeController then image added to the specified page of the pdf document. Final result will be like as follows

We have prepared a sample .you can download it from below sample link

Sample Link:

http://www.syncfusion.com/downloads/support/forum/119103/WebApplication1-253868983.zip

Please let us know if you any further assistance.

Thanks,

Vinothkumar Arumugam.

Note: Open the sample in following browsers

1. Mozilla Firefox

2. Google chrome


CONFIRMATION

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.

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.

;