Wisej.NET Examples
HomeSupportDocumentation
  • Introduction
  • Tutorials
    • StockViewer
      • Structure
      • User Interface
      • Animations
      • Localization
      • Code
  • Examples
    • AspNetAuthentication
    • BackgroundTasks
    • Buttons
    • ChartJS
    • CodeProject
    • CustomCellRenderer
    • CustomPainting
    • DataBinding
    • DataRepeaterDragDrop
    • DeepLinking
    • Download
    • EditorsChoice
    • FullCalendar
    • GoogleMaps
    • KeyboardHandling
    • LazyLoadingPanel
    • Localization
    • MDIExample
    • ModalWorkflow
    • NavigationBar
    • Pannellum
    • ProgressCircle
    • Responsive
    • RibbonBar
    • SimpleChat
    • SlideBar
    • SmoothieChart
    • TagInput
    • TourPanel
    • TreeGrid
    • UploadFiles
    • UserControl
    • UserDesktop
    • UserPaintCells
  • Premium
    • Syncfusion EJ2 DocumentEditor
    • Syncfusion EJ2 FileManager
    • Syncfusion EJ2 PdfViewer
    • KendoUI Captcha
    • KendoUI TaskBoard
Powered by GitBook
On this page
  • Source Code
  • Design-Time
  • Sample Implementation
  • Runtime

Was this helpful?

Export as PDF
  1. Premium

Syncfusion EJ2 PdfViewer

The PDF Viewer component enables you to view and print the PDF files.

PreviousSyncfusion EJ2 FileManagerNextKendoUI Captcha

Last updated 1 year ago

Was this helpful?

This sample demonstrate the following key features of PDF Viewer:

  • View the PDF document

  • Core interactions - Scrolling, Zooming, panning and page navigation

  • Built-in toolbar

  • Select and copy text from PDF file

  • Search a text easily across the PDF document

  • Easy navigation with the help of Bookmarks, thumbnails, hyperlinks and table of contents

  • View modes - fit to page and fit to width

  • Print the entire document or a specific page directly from the browser.

More information on the PDF Viewer instantiation can be found in this .

Source Code

You can download the source code for this project here.

Design-Time

The EJ2 PdfViewer control can be added to a Form or Page from the Visual Studio Toolbox. It should look like this when dropped onto the designer.

The design-time appearance of the EJ2 PdfViewer control will not show a PDF document. The logic for this should be implemented in your code (see below).

Sample Implementation

PdfViewer.cs
/// <summary>
/// PDF Viewer Server Side Configuration Example.
/// https://github.com/SyncfusionExamples/PdfViewer-Server/blob/master/src/ej2-pdfviewer-server/Controllers/PdfViewerController.cs.
/// </summary>
public partial class PDFViewer : TestBase
{
public PDFViewer()
{
	InitializeComponent();
}

private void pdfViewer1_Appear(object sender, EventArgs e)
{
	this.pdfViewer1.Instance.load("Wisej.pdf", null);
}

private void pdfViewer1_WebRequest(object sender, WebRequestEventArgs e)
{
	// decode payload.
	dynamic payload = null;
	using (StreamReader reader = new StreamReader(e.Request.InputStream))
	{
		var text = reader.ReadToEnd();
		payload = JsonConvert.DeserializeObject<Dictionary<string, string>>(text);
	}

	switch(payload["action"])
	{
		case "Load":
			e.Response.Write(LoadPdf(payload));
			break;

		case "RenderPdfPages":
			e.Response.Write(RenderPdfPages(payload));
			break;

		case "RenderPdfTexts":
			e.Response.Write(RenderPdfTexts(payload));
			break;

		case "RenderThumbnailImages":
			e.Response.Write(RenderThumbnailImages(payload));
			break;

		case "Download":
			e.Response.Write(Download(payload));
			break;

		case "PrintImages":
			e.Response.Write(PrintImages(payload));
			break;

		case "RenderAnnotationComments":
			e.Response.Write(RenderAnnotationComments(payload));
			break;

		case "Unload":
			e.Response.Write(PrintImages(payload));
			break;

		default:
			break;

	}
}

private string RenderPdfTexts(dynamic payload)
{
;			var renderer = new PdfRenderer();
	var result = renderer.GetDocumentText(payload);
	return JsonConvert.SerializeObject(result);
}

private string LoadPdf(Dictionary<string, string> payload)
{
	MemoryStream ms;
	PdfRenderer renderer = new PdfRenderer();
	bool isFileName = bool.Parse(payload["isFileName"]);
	if (isFileName)
	{
		var path = Application.MapPath($"Data/PdfViewer/{payload["document"]}");
		var bytes = File.ReadAllBytes(path);
		ms = new MemoryStream(bytes);
	}
	else
	{
		var bytes = Convert.FromBase64String(payload["document"]);
		ms = new MemoryStream(bytes);
	}

	var result = renderer.Load(ms, payload);
	return JsonConvert.SerializeObject(result, Formatting.None);
}

private string RenderPdfPages(Dictionary<string, string> payload)
{
	var renderer = new PdfRenderer();
	var page = renderer.GetPage(payload);
	return JsonConvert.SerializeObject(page);
}

private string RenderThumbnailImages(Dictionary<string, string> payload)
{
	var renderer = new PdfRenderer();
	var result = renderer.GetThumbnailImages(payload);
	return JsonConvert.SerializeObject(result);
}

private string Download(Dictionary<string, string> payload)
{
	var renderer = new PdfRenderer();
	return renderer.GetDocumentAsBase64(payload);
}

private string PrintImages(Dictionary<string, string> payload)
{
	var renderer = new PdfRenderer();
	var result = renderer.GetPrintImage(payload);
	return JsonConvert.SerializeObject(result);
}

private string Unload(Dictionary<string, string> payload)
{
	var renderer = new PdfRenderer();
	renderer.ClearCache(payload);
	return "Cleared Cache.";
}

private string RenderAnnotationComments(Dictionary<string, string> payload)
{
	var renderer = new PdfRenderer();
	var result = renderer.GetAnnotationComments(payload);
	return JsonConvert.SerializeObject(result);
}

private void button1_Click(object sender, EventArgs e)
{
	this.pdfViewer1.Instance.load("Annotations.pdf", null);
}

Runtime

The resulting EJ2 PdfViewer control will look something like this:

documentation section
Wisej-DemoBrowser/Wisej.DemoBrowser.Premium/Wisej.Web.Ext.Syncfusion2.Demo at main · iceteagroup/Wisej-DemoBrowserGitHub
Logo
EJ2 PDF Viewer at Design-Time
EJ2 PDF Viewer at Runtime