Guide for C#
Core Document Formats
HTML5 Web Viewer
Additional Features

C# TIFF - Create Online TIFF Viewer in C#.NET

Visual C# Code for Creating TIFF HTML5 Web Viewer in .NET Program

Visual C#
Home > .NET Imaging SDK > C# > Create Online TIFF Web Viewer

"This online guide content is Out Dated!
    Please get the latest XDoc.Tiff C# Developer Guide here.

C# TIFF HTML5 Web Viewer Overview
RasterEdge .NET TIFF Imaging Web Viewer is built with RasterEdge .NET Imaging HTML5 Web Viewer SDK control which supports TIFF document loading, TIFF page reordering, TIFF page processing, annotating, etc. If you want to create online TIFF viewer for your web based projects, RasterEdge .NET TIFF Web Viewer Add-on is your best choice. We provide cost effective AJAX based TIFF file viewer that will suit you best, with which you may quickly add online TIFF viewing functionality into your own designed C#.NET application.
RasterEdge .NET Imaging Web Viewer SDK is a JavaScript based control, using latest HTML5 technology and compatible with any modern web browsers. Once installed on Windows compatible server, No additional add-in needed in client side.
This TIFF HTML5 web viewer tutorial is designed to describe following contents.
  • RasterEdge TIFF .NET Web Viewer feature list in C# ASP.NET
  • How to create TIFF HTML5 Web Viewer in C#.NET (Online Document Viewer Demo)
  • RasterEdge supported image, PDF and Word web viewers
C#.NET TIFF HTML5 Web Viewer Feature List
  • Easy to integrate, no additional add-in needed in client side
  • Compliant with any C# ASP.NET web application
  • Compatible Visual Studio 2005 and later version
  • Developed in 100% ASP.NET and C#
  • View and customize TIFF image and document
  • Add, delete, reorder web TIFF document page
  • Mature TIFF image navigation & paging selection
  • Rotate TIFF page in 90,-90,180 degrees
  • Support TIFF page annotation with particular text or graphics
  • Save TIFF image file or its annotation in native file format
  • Support modern browsers, including IE, Chrome, Firefox, Safari, etc.
How to Create TIFF HTML5 Web Viewer in C#.NET
Following detailed guide tips show how to create TIFF document web viewer using RasterEdge .NET Imaging Web Viewer SDK control. We still demonstrate how to create more web viewers on PDF and Word documents at the bottom of this page.
  1. Create an ASP.NET website in Visual Studio 2005 or any later version;
  2. Add .NET Web Viewer Control DLL in download package ("bin" folder) to your C#.NET project reference. There's no need to add other dependencies to your web project, because they will be added automatically;
    • RasterEdge.Imaging.WebViewer.dll
  3. Modify the configuration file with the content of Web.config in download package to your web configuration file (Web.config).
  4. Copy .NET Web TIFF Viewer resources to your C# web project folder, which include RasterEdge_Imaging_Files and RasterEdge_Demo_Docs and RasterEdge_Cache;
  5. If you want to embed .NET Web TIFF Document Viewer DLL into your C#.NET web page, you may create a new Web Form (Default.aspx);
  6. Add demo code below to Default.aspx to create C#.NET web TIFF document viewer objects and initialize the viewer.
<link href="RasterEdge_Imaging_Files/RasterEdge.css" rel="stylesheet"type="text/css"/>
<script src="RasterEdge_Imaging_Files/RasterEdge.js" type="text/javascript"></script>
<script src="RasterEdge_Imaging_Files/CreateViewerToolBar.js" type="text/javascript"></script>
<script type="text/javascript">
_fid = "<%=fid %>";
_viewer = new RasterEdgeViewer({
_serverUrl: "/RasterEdge_Imaging_Files/WebHandler.ashx",
//0 represent png, 1 represent svg
_pdfViewer: 1,
_wordViewer: 1,

//Set width and height of the webViewer(pixel)
_viewerWidth: 1024,
_viewerHeight: 730,

//define annotation style
//annotation style
//Color:Hexadecimal color can be used
//Transparency:1 on behalf of saturated, 0 represents completely transparent
TextAnnoStyle = new AnnoStyle({FillColor: "White", ShowedText: "double click to edit", TextColor: "Black", TextFont: "Arial", TextSize: 12, TextStyle :"normal"});
FreehandAnnoStyle = new AnnoStyle({OutLineColor: "Red", OutLineWidth: 5.0});
HighlightAnnoStyle = new AnnoStyle({FillColor: "Yellow"});
RectangleAnnoStyle = new AnnoStyle({OutLineColor: "Black", OutLineWidth: 3.0});
FilledRectangleAnnoStyle = new AnnoStyle({OutLineColor: "Black", OutLineWidth: 3.0, FillColor: "Black", Transparency: 1});
EllipseAnnoStyle = new AnnoStyle({FillColor: "Orange"});
RubberStampAnnoStyle = new AnnoStyle({OutLineColor: "Tomato", OutLineWidth: 3.0, FillColor: "Red", ShowedText: "Good", TextColor: "Black", TextFont: "Arial", TextSize: 12, TextStyle: "Italic"});
PolygonLinesAnnoStyle = new AnnoStyle({OutLineColor: "Red", OutLineWidth: 5.0});
PolygonAnnoStyle = new AnnoStyle({OutLineColor: "OrangeRed", OutLineWidth: 3.0, FillColor: "OrangeRed"});
LineAnnoStyle = new AnnoStyle({OutLineColor: "Red", OutLineWidth: 5.0});
ArrowAnnoStyle = new AnnoStyle({OutLineColor: "Red", OutLineWidth: 5.0, FillColor: "Red",Transparency:0.8});

//Set whether the toolbar shows the corresponding icon(true or false)
//You can set the item including:_toolbar/_fileToolbar/_annoToolbar/_fullToolbar
//_uploadToolbar/_printToolbar/_saveToolbar/_convertToolbar //_textToolbar/_freehandToolbar/_arrowToolbar/_lineToolbar/_polygonLinesToolbar/_filledRectangleToolbar/_rectangleToolbar/_highlightToolbar/_ellipseToolbar/_polygonToolbar/_rubberStampToolbar/_deleteToolbar
  1. Customize the viewing area for C#.NET TIFF document viewing;
<div class="re_container">
<div class = "re_func_toolbar"></div>
<div id="_tblImgs"class="re_content" style="width:100%">
<div class="RE_WebViewer" id="REWebViewer1"></div>
  1. Customize specific functions of C#.NET web TIFF viewing application by adding demo code below into Default.aspx.cs (code behind for Default.aspx )
public string mode;
public string fid;
protected void Page_Load(object sender, EventArgs e)
string command = Request.Form["RECommand"];
if (command == null || command.Equals(""))
else if (command.Equals("OpenFile"))
else if (command.Equals("SaveFile"))

public void LoadFileFromUrl()
string file = Request.QueryString["file"];
if (file != null &&file != "")
file = file.Trim();
string initFilePath = file;
string projectName = System.Web.HttpContext.Current.Request.PhysicalApplicationPath.Replace("\\", "/");
string path = projectName + "
/RasterEdge_Demo_Docs/" + initFilePath;
if (File.Exists(path))
fid = REDocumentControl.GenerateId();
string result = LoadFile("
RasterEdge_Demo_Docs" + initFilePath, fid);
if (result != "
", "<script>alert('" + result + "');</script>");

public void LoadFileFromUpload()
string uploadFile = Request.Form["
string filename = "
/RasterEdge_Cache/" + uploadFile;
fid = Request.Form["
string result = LoadFile(filename, fid);

//load document from stream
//REDocumentControl.LoadFile(Stream stream, fid);

//load document from array
//REDocumentControl.LoadFile(byte[] array, fid);

public void SaveFile()
string fileName = Request.Form["
string fid = Request.Form["

private string LoadFile(string filename,string fid)
string result = "
REDocumentControl.LoadFile(filename, fid);
catch (Exceptionex)
result = ex.Message.ToString();
return result;
RasterEdge Image, PDF and Word Web Viewers
Besides TIFF online viewer in C# ASP.NET, RasterEdge also supports creating image, PDF and Word web viewers, as well as TIFF document windows & mobile viewers by using RasterEdge .NET Imaging Web Viewer SDK .
More Tutorial!

Recommend this to Google+ is professional provider of document, content and imaging solutions, available for ASP.NET AJAX, Silverlight, Windows Forms as well as WPF. We are dedicated to provide powerful & profession imaging controls, PDF document, image to pdf files and components for capturing, viewing, processing, converting, compressing and stroing images, documents and more.

©2000-2016 Raster