PDF Export
The Telerik UI for ASP.NET MVC Gantt component provides a built-in PDF export functionality.
For a runnable example, refer to the demo on exporting the Gantt to PDF.
Getting Started
To enable PDF export:
- Include the corresponding toolbar command and set the export settings.
- Include the
Pako Deflate
library in the page to enable compression.
The following example demonstrates how to enable the PDF export functionality of the Gantt.
<!-- Load Pako Deflate library to enable PDF compression -->
<script src="https://unpkg.com/pako/dist/pako_deflate.min.js"></script>
@(Html.Kendo().Gantt<TaskViewModel, DependencyViewModel>()
.Name("gantt")
.Toolbar(tb =>
{
tb.Add().Name("pdf");
})
.Pdf(pdf => pdf
.FileName("Gantt Export.pdf")
)
//...additional Gantt configuration...
)
Saving Files on the Server
To send the generated file to a remote endpoint, use the ProxyURL()
and ForceProxy()
methods.
<!-- Load Pako Deflate library to enable PDF compression -->
<script src="https://unpkg.com/pako/dist/pako_deflate.min.js"></script>
@(Html.Kendo().Gantt<TaskViewModel, DependencyViewModel>()
.Name("gantt")
.Toolbar(tb =>
{
tb.Add().Name("pdf");
})
.Pdf(pdf => pdf
.FileName("Gantt Export.pdf")
.ForceProxy(true)
.ProxyURL(Url.Action("PdfExportSave", "Home"))
)
//...additional Gantt configuration...
)
[HttpPost]
public ActionResult PdfExportSave(string contentType, string base64, string fileName)
{
var fileContents = Convert.FromBase64String(base64);
return File(fileContents, contentType, fileName);
}
Embedding Unicode Characters
The default fonts in PDF files do not provide Unicode support. To support international characters, you have to embed an external font. For more information on the supported Deja Vu font family as part of the Kendo UI distributions and other fonts, refer to the Kendo UI for jQuery article on custom fonts and PDF.
The following example demonstrates how to handle custom fonts.
<style>
/*
Use the DejaVu Sans font for display and embedding in the PDF file.
The standard PDF fonts have no support for Unicode characters.
*/
.k-gantt {
font-family: "DejaVu Sans", "Arial", sans-serif;
}
/* Hide the Gantt toolbar during export */
.k-pdf-export .k-gantt-toolbar {
display: none;
}
</style>
Further Reading
- PDF output by the Kendo UI Drawing library
- Drawing DOM elements with the Kendo UI Drawing library
- Saving files with Kendo UI