Render Visio documents as HTML, PDF, and image files Leave feedback

GroupDocs.Viewer for .NET allows you to render your Visio diagrams in HTML, PDF, PNG, and JPEG formats. You do not need to use Microsoft Visio or other diagramming software to load and view Visio files within your .NET application (web or desktop).

To start using the GroupDocs.Viewer API, create a Viewer class instance. Pass a document you want to view to the class constructor. You can load the document from a file or stream. Call one of the Viewer.View method overloads to convert the document to HTML, PDF, or image format. These methods allow you to render the entire document or specific pages.

View Visio files online View demos and examples on GitHub

GroupDocs.Viewer supports the following Visio file formats:

• Visio Drawing (.VSDX)
• Visio 2003-2010 Drawing (.VSD)
• Visio Macro-Enabled Drawing (.VSDM)
• Visio Stencil (.VSSX)
• Visio 2003-2010 Stencil (.VSS)
• Visio Macro-Enabled Stencil (.VSSM)
• Visio Template (.VSTX)
• Visio 2003-2010 Template (.VST)
• Visio Macro-Enabled Template (.VSTM)
• Visio Drawing XML File (.VDX)
• Visio Stencil XML File (.VSX)
• Visio Template XML File (.VTX)
• Visio Web Drawing (.VDW)

GroupDocs.Viewer can detect the document format automatically based on information in the file header.

Note

Family of Visio file formats currently is not supported by the GroupDocs.Viewer.CrossPlatform.

Create an HtmlViewOptions class instance and pass it to the Viewer.View method to convert a Visio file to HTML. The HtmlViewOptions class properties allow you to control the conversion process. For instance, you can embed all external resources in the generated HTML file, minify the output file, and optimize it for printing. Refer to the following documentation section for details: Rendering to HTML.

To save all elements of an HTML page (including text, graphics, and stylesheets) into a single file, call the HtmlViewOptions.ForEmbeddedResources method and specify the output file name.

using GroupDocs.Viewer;
using GroupDocs.Viewer.Options;
// ...

using (var viewer = new Viewer("flowchart.vsdx"))
{
    // Create an HTML file for each drawing page.
    // {0} is replaced with the current page number in the file name.
    var viewOptions = HtmlViewOptions.ForEmbeddedResources("page_{0}.html");
    viewer.View(viewOptions);
}

The following image demonstrates the result:

If you want to store an HTML file and additional resource files (such as fonts, images, and stylesheets) separately, call the HtmlViewOptions.ForExternalResources method and pass the following parameters:

• The output file path format
• The path format for the folder with external resources
• The resource URL format

using GroupDocs.Viewer;
using GroupDocs.Viewer.Options;
// ...

using (var viewer = new Viewer("flowchart.vsdx"))
{
    // Create an HTML file for each drawing page.
    // Specify the HTML file names and location of external resources.
    // {0} and {1} are replaced with the current page number and resource name, respectively.
    var viewOptions = HtmlViewOptions.ForExternalResources(
        "page_{0}.html", "page_{0}/resource_{0}_{1}", "page_{0}/resource_{0}_{1}");
    viewer.View(viewOptions);
}

The image below demonstrates the result. External resources are placed in a separate folder.

Create a PdfViewOptions class instance and pass it to the Viewer.View method to convert a Visio file to PDF. The PdfViewOptions class properties allow you to control the conversion process. For instance, you can protect the output PDF file, reorder its pages, and specify the quality of document images. Refer to the following documentation section for details: Rendering to PDF.

using GroupDocs.Viewer;
using GroupDocs.Viewer.Options;
// ...

using (var viewer = new Viewer("flowchart.vsdx"))
{
    // Create a PDF file for the document.
    // Specify the PDF file name.
    var viewOptions = new PdfViewOptions("output.pdf");
    viewer.View(viewOptions);
}

The following image demonstrates the result:

Create a PngViewOptions class instance and pass it to the Viewer.View method to convert a Visio file to PNG. Use the PngViewOptions.Height and PngViewOptions.Width properties to specify the output image size in pixels.

using GroupDocs.Viewer;
using GroupDocs.Viewer.Options;
// ...

using (var viewer = new Viewer("flowchart.vsdx"))
{
    // Create a PNG image for each drawing page.
    // {0} is replaced with the current page number in the image name.
    var viewOptions = new PngViewOptions("output_{0}.png");
    // Set width and height.
    viewOptions.Width = 950;
    viewOptions.Height = 800;
    viewer.View(viewOptions);
}

Create a JpgViewOptions class instance and pass it to the Viewer.View method to convert a Visio file to JPEG. Use the JpgViewOptions.Height and JpgViewOptions.Width properties to specify the output image size in pixels.

using GroupDocs.Viewer;
using GroupDocs.Viewer.Options;
// ...

using (var viewer = new Viewer("flowchart.vsdx"))
{
    // Create a JPEG image for each drawing page.
    // {0} is replaced with the current page number in the image name.
    var viewOptions = new JpgViewOptions("output_{0}.jpg");
    // Set width and height.
    viewOptions.Width = 950;
    viewOptions.Height = 800;
    viewer.View(viewOptions);
}

GroupDocs.Viewer allows you to render shapes used in a Visio diagram or stored in a Visio stencil file. These shapes are displayed in the Document Stencil pane in Microsoft Visio.

To render only master shapes contained in Visio file, enable the VisioRenderingOptions.RenderFiguresOnly property for one of the following classes (depending on the output file format):

• HtmlViewOptions
• PdfViewOptions
• PngViewOptions
• JpgViewOptions

The VisioRenderingOptions.FigureWidth property allows you to specify the shape width in pixels. The height is calculated automatically based on the aspect ratio of each shape.

using GroupDocs.Viewer;
using GroupDocs.Viewer.Options;
// ...

using (var viewer = new Viewer("map.vsdx"))
{
    // Convert the Visio file to PDF.
    var viewOptions = new PdfViewOptions("output.pdf");
    // Render the master shapes only.
    viewOptions.VisioRenderingOptions.RenderFiguresOnly = true;
    // Specify shape width in pixels.
    viewOptions.VisioRenderingOptions.FigureWidth = 200;
    viewer.View(viewOptions);
}

The image below demonstrates the result.