# Adding and Sharing Annotations across Document Types using the Document Viewer in ASP.NET Core C#

> Learn how to add and share annotations across different document types using the Document Viewer in ASP.NET Core C#. This article shows how to create a simple web application that allows users to view and annotate documents in a collaborative environment.

- **Author:** Bjoern Meyer
- **Published:** 2024-04-19
- **Modified:** 2025-11-16
- **Description:** Learn how to add and share annotations across different document types using the Document Viewer in ASP.NET Core C#. This article shows how to create a simple web application that allows users to view and annotate documents in a collaborative environment.
- **4 min read** (649 words)
- **Tags:**
  - ASP.NET
  - ASP.NET Core
  - Collaboration
  - Document Viewer
- **Web URL:** https://www.textcontrol.com/blog/2024/04/19/adding-and-sharing-annotations-across-document-types-using-the-document-viewer-in-asp-net-core-c-sharp/
- **LLMs URL:** https://www.textcontrol.com/blog/2024/04/19/adding-and-sharing-annotations-across-document-types-using-the-document-viewer-in-asp-net-core-c-sharp/llms.txt
- **LLMs-Full URL:** https://www.textcontrol.com/blog/2024/04/19/adding-and-sharing-annotations-across-document-types-using-the-document-viewer-in-asp-net-core-c-sharp/llms-full.txt

---

Similar to annotations in Adobe Acrobat Reader, the TX Text Control Document Viewer supports annotations including drawings, stamps, sticky notes, and comments. Comments and annotations are based on the current user, similar to the Document Editor, where a username defines the current user.

### User Annotations

When the Document Viewer is initialized, the *UserNames* property is used to provide a string that represents the user. Typically, this is the username logged into your application that uses the Document Viewer.

```
<div class="tx-container">
    @Html.TXTextControl().DocumentViewer(settings => {
        settings.DocumentPath = Server.MapPath("~/App_Data/Documents/invoice_results.docx");
        settings.Dock = DocumentViewerSettings.DockStyle.Fill;
        settings.IsSelectionActivated = true;
        settings.ShowThumbnailPane = false;
        settings.UserNames = new string[] { "Tim Typer" };
    }).Render()
</div>
```

Now all annotations will be tracked with the registered username string.

![Annotations in the Document Viewer](https://s1-www.textcontrol.com/assets/dist/blog/2024/04/19/a/assets/viewer1.webp "Annotations in the Document Viewer")

The Document Viewer provides a full-featured interface for changing colors and font sizes, creating and adding signature stamps, and adding comments to inserted annotations.

![Annotations in the Document Viewer](https://s1-www.textcontrol.com/assets/dist/blog/2024/04/19/a/assets/viewer2.webp "Annotations in the Document Viewer")

Custom stamps can be added to the list of available stamps using JavaScript:

```
TXDocumentViewer.annotations.setStampList([
  {
    "text": "text control rocks!",
    "color": "rgba(98, 158, 44, .9)",
    "font": "Arial",
    "size": "38",
    "weight": "bold",
    "style": "normal"
  },
  {
    "text": "custom stamp",
    "color": "rgba(0, 0, 200, .9)",
    "font": "Arial",
    "size": "60",
    "weight": "bold",
    "style": "normal"
  }
]);
```

![Annotations in the Document Viewer](https://s1-www.textcontrol.com/assets/dist/blog/2024/04/19/a/assets/viewer3.webp "Annotations in the Document Viewer")

### Document Types

The Document Viewer supports various document types including PDF, DOCX, and RTF. Annotations can be added to all supported document types and are stored separately as a JSON string.

Unlike other document viewers or PDF-only viewers, the interface and annotation format is the same for all formats. This allows you to create a consistent user experience for all document types. In a typical document collaboration process, where items are discussed or commented on, the document needs to be modified before final approval. In this case, the document should be stored and shared in a format that can actually be properly modified, such as DOCX or the internal TX Text Control format, rather than PDF.

> **Learn More**
> 
> In this article, we will discuss the advantages of using a true WYSIWYG editing experience for PDF document generation instead of using PDF templates or PDF editors.
> 
> [Why use PDF Templates or Editors when you can use True WYSIWYG Editing? ](https://www.textcontrol.com/blog/2024/02/27/why-use-pdf-templates-or-editors-when-you-can-use-true-wysiwyg-editing/llms-full.txt)

### Share Annotations

Annotations can be shared with other users by exporting and importing them. The following code shows how to export annotations to a JSON string:

```
TXDocumentViewer.annotations.export()
```

This code returns a JSON object with all the annotations:

```
[
   [
      {
         "user":"Tim Typer",
         "time":1713543982215,
         "comments":[
            {
               "comment":"Here is a comment",
               "user":"Tim Typer",
               "date":1713543988884,
               "id":"1905c577-e9c4-49e7-8632-b9727cd3d972",
               "status":"none"
            }
         ],
         "id":"01d034a9-ea83-44a0-8286-700f7224670f",
         "pen":{
            "type":"highlight",
            "color":"rgba(255, 0, 0, 1)",
            "start":1,
            "end":15,
            "text":"Payment Invoice"
         },
         "status":"Accepted"
      }
   ],
   [
      
   ],
   [
      
   ]
]
```

Annotations can be imported using the following code:

```
TXDocumentViewer.annotations.load(annotationData);
```

This concept allows you to create live collaboration applications where other users can see changes by synchronously exchanging the JSON.

> **Learn More**
> 
> Digital collaboration has become the norm in today's modern business world. Adding real-time document collaboration adds significant value to your applications and increases the productivity of your users. This example shows how to share document annotations live with other users using SignalR.
> 
> [DocumentViewer Collaboration: Live Share Document Annotations ](https://www.textcontrol.com/blog/2021/06/08/documentviewer-collaboration-live-share-document-annotations/llms-full.txt)

### Conclusion

The TX Text Control Document Viewer provides a full-featured interface for adding and managing annotations in various document types. Annotations can be shared with other users and are stored separately as a JSON string. This allows you to create live collaboration applications where other users can see changes by synchronously exchanging the JSON.

---

## About Bjoern Meyer

As CEO, Bjoern is the visionary behind our strategic direction and business development, bridging the gap between our customers and engineering teams. His deep passion for coding and web technologies drives the creation of innovative products. If you're at a tech conference, be sure to stop by our booth - you'll most likely meet Bjoern in person. With an advanced graduate degree (Dipl. Inf.) in Computer Science, specializing in AI, from the University of Bremen, Bjoern brings significant expertise to his role. In his spare time, Bjoern enjoys running, paragliding, mountain biking, and playing the piano.

- [LinkedIn](https://www.linkedin.com/in/bjoernmeyer/)
- [X](https://x.com/txbjoern)
- [GitHub](https://github.com/bjoerntx)

---

## Related Posts

- [Document Viewer: Processing Tracked Changes](https://www.textcontrol.com/blog/2022/03/09/document-viewer-processing-tracked-changes/llms.txt)
- [High-Performance Text Replacement in Large DOCX Files using C# .NET](https://www.textcontrol.com/blog/2025/07/30/high-performance-text-replacement-in-large-docx-files-using-csharp-dotnet/llms.txt)
- [Document Viewer 33.2.1 Released: New Event and Bug Fixes](https://www.textcontrol.com/blog/2025/07/30/document-viewer-33-2-1-released-new-event-and-bug-fixes/llms.txt)
- [Building an ASP.NET Core Backend (Linux and Windows) for the Document Editor and Viewer](https://www.textcontrol.com/blog/2025/03/26/building-an-asp-net-core-backend-for-the-document-editor-and-viewer/llms.txt)
- [TX Text Control Document Editor and Viewer for Blazor Released](https://www.textcontrol.com/blog/2025/03/25/tx-text-control-document-editor-and-viewer-for-blazor-released/llms.txt)
- [Getting Started: Document Viewer for Blazor in ASP.NET Core](https://www.textcontrol.com/blog/2025/03/25/getting-started-document-viewer-for-blazor-in-asp-net-core/llms.txt)
- [Announcing Our Work on a Blazor Component for Document Editing and Viewing](https://www.textcontrol.com/blog/2025/01/24/announcing-our-work-on-a-blazor-component-for-document-editing-and-viewing/llms.txt)
- [Preparing Documents for E-Signing for Multiple Signers in .NET C#](https://www.textcontrol.com/blog/2024/11/13/preparing-documents-for-e-signing-for-multiple-signers-in-net-c-sharp/llms.txt)
- [ASP.NET Core: Use the Document Editor and Viewer in the Same Razor View](https://www.textcontrol.com/blog/2024/11/08/asp-net-core-use-the-document-editor-and-viewer-in-the-same-razor-view/llms.txt)
- [Optimizing Digital Signature Workflows: Starting with MS Word DOCX Files Instead of PDFs in C#](https://www.textcontrol.com/blog/2024/09/27/optimizing-digital-signature-workflows-starting-with-ms-word-docx-files-instead-of-pdfs-in-csharp/llms.txt)
- [Document Viewer: Setting the Rendering Mode](https://www.textcontrol.com/blog/2024/08/22/document-viewer-setting-the-rendering-mode/llms.txt)
- [View MS Word DOCX and PDF Documents using a .NET C# Document Viewer for ASP.NET Core and ASP.NET](https://www.textcontrol.com/blog/2024/08/08/view-ms-word-docx-and-pdf-documents-using-a-net-csharp-document-viewer-for-aspnet-core-and-aspnet/llms.txt)
- [Getting Started Video Tutorial: How to Add Electronic and Digital Signatures to PDF Documents in ASP.NET Core C#](https://www.textcontrol.com/blog/2024/08/05/getting-started-video-tutorial-how-to-add-electronic-and-digital-signatures-to-pdf-documents-in-asp-net-core-csharp/llms.txt)
- [Getting Started Video Tutorial: How to use the Document Viewer in ASP.NET Core C#](https://www.textcontrol.com/blog/2024/08/05/getting-started-video-tutorial-how-to-use-the-document-viewer-in-asp-net-core-csharp/llms.txt)
- [Transforming Financial Documents into Smart and Secure Forms in ASP.NET Core C#](https://www.textcontrol.com/blog/2024/05/01/transforming-financial-documents-into-smart-and-secure-forms-in-asp-net-core-c-sharp/llms.txt)
- [Document Viewer: Long Polling Support for Loading Documents](https://www.textcontrol.com/blog/2024/04/25/document-viewer-long-polling-support-for-loading-documents/llms.txt)
- [Adding a Security Middleware to ASP.NET Core Web Applications to Protect TX Text Control Document Editor and Document Viewer Endpoints](https://www.textcontrol.com/blog/2024/03/18/adding-a-security-middleware-to-asp-net-core-web-applications-to-protect-tx-text-control-document-editor-and-document-viewer-endpoints/llms.txt)
- [Building an ASP.NET Core Backend Application to Host the Document Editor and Document Viewer](https://www.textcontrol.com/blog/2024/03/14/building-an-asp-net-core-backend-application-to-host-the-document-editor-and-document-viewer/llms.txt)
- [Signature Soft Pad Customization](https://www.textcontrol.com/blog/2023/11/20/signature-soft-pad-customization/llms.txt)
- [Securing the Signature Endpoint with Custom ActionFilterAttributes](https://www.textcontrol.com/blog/2023/07/25/securing-the-signature-endpoint-with-custom-actionfilterattributes/llms.txt)
- [Common Web API Methods for Handling E-Signature Workflows in ASP.NET Core C#](https://www.textcontrol.com/blog/2023/07/20/common-web-api-methods-for-handling-esignature-workflows-in-aspnet-core-csharp/llms.txt)
- [Use PDF.js to Render PDF Documents within the Document Viewer](https://www.textcontrol.com/blog/2023/03/18/use-pdfjs-to-render-pdf-documents-within-the-document-viewer/llms.txt)
- [Document Viewer 31.2.2 RC1 Released with New Features](https://www.textcontrol.com/blog/2023/03/17/document-viewer-3122-rc1-released-with-new-features/llms.txt)
- [Feature Announcement: Enabling External PDF Renderer PDF.js in TX Text Control DocumentViewer](https://www.textcontrol.com/blog/2023/01/20/documentviewer-enabling-external-pdf-renderer-pdfjs/llms.txt)
- [Document Viewer: SignatureSettings Explained](https://www.textcontrol.com/blog/2022/09/16/document-viewer-signaturesettings-explained/llms.txt)
