diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/comments.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/comments.md index 8abd02e3c5..4545497e05 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/comments.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/comments.md @@ -1,7 +1,7 @@ --- layout: post -title: Comments in ##Platform_Name## Pdfviewer Component -description: Learn here all about Comments in Syncfusion ##Platform_Name## Pdfviewer component of Syncfusion Essential JS 2 and more. +title: Comments in ##Platform_Name## PDF Viewer Component | Syncfusion +description: Learn here all about Comments in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Comments publishingplatform: ##Platform_Name## diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/free-text-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/free-text-annotation.md index 4aabe85486..d915c57937 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/free-text-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/free-text-annotation.md @@ -4,11 +4,10 @@ title: Free Text Annotation in EJ2 ASP.NET MVC PDF Viewer | Syncfusion description: Learn here all about Free Text Annotation in ASP.NET MVC PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Free Text Annotation -publishingplatform: ej2-asp-core-mvc +publishingplatform: ##Platform_Name## documentation: ug --- - # Free Text Annotation in the ASP.NET MVC PDF Viewer component The PDF Viewer control provides the options to add, edit, and delete the free text annotations. @@ -30,36 +29,163 @@ Refer to the following code sample to switch to the Free Text annotation mode. {% tabs %} {% highlight html tabtitle="Standalone" %} -```html - - -
- @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- -``` + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} + +{% highlight html tabtitle="Server-Backed" %} + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% endtabs %} + +## Adding a free text annotation programmatically to the PDF document + +The PDF Viewer library allows you to add the free text annotation in the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here is an example of how you can use the **addAnnotation()** method to move the free text annotation programmatically: + +{% tabs %} +{% highlight html tabtitle="Standalone" %} + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + + +{% endhighlight %} +{% highlight html tabtitle="Server-Backed" %} + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + + {% endhighlight %} +{% endtabs %} + +## Change the content of an existing Free text annotation programmatically + +To change the content of an existing free text annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method to change the content of a free text annotation: + +{% tabs %} +{% highlight html tabtitle="Standalone" %} + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html - - -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- -``` + } + + {% endhighlight %} {% endtabs %} @@ -131,19 +257,17 @@ Refer to the following code sample to set the default free text annotation setti {% tabs %} {% highlight html tabtitle="Standalone" %} -```html
@Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").FreeTextSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerFreeTextSettings { FillColor = "green", BorderColor = "blue", FontColor = "yellow" }).Render()
-``` + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html
@Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").FreeTextSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerFreeTextSettings { FillColor = "green", BorderColor = "blue", FontColor = "yellow" }).Render()
-``` + {% endhighlight %} {% endtabs %} @@ -151,17 +275,17 @@ You can also enable the autofit support for free text annotation by using the En {% tabs %} {% highlight html tabtitle="Standalone" %} -```html +
@Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").FreeTextSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerFreeTextSettings { EnableAutoFit = true }).Render()
-``` + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html +
@Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").FreeTextSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerFreeTextSettings { EnableAutoFit = true }).Render()
-``` + {% endhighlight %} {% endtabs %} \ No newline at end of file diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/ink-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/ink-annotation.md index 27b9aa24a6..e04cf250ef 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/ink-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/ink-annotation.md @@ -1,14 +1,13 @@ --- layout: post -title: Ink Annotation in ##Platform_Name## Pdfviewer Component -description: Learn here all about Ink Annotation in Syncfusion ##Platform_Name## Pdfviewer component of Syncfusion Essential JS 2 and more. +title: Ink Annotation in ##Platform_Name## PDF Viewer Component | Syncfusion +description: Learn here all about Ink Annotation in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Ink Annotation publishingplatform: ##Platform_Name## documentation: ug --- - # Ink Annotation in the ASP.NET MVC PDF Viewer component The PDF Viewer control provides the options to add, edit, and delete the ink annotations. @@ -29,34 +28,149 @@ Refer to the following code sample to switch to the ink annotation mode. {% tabs %} {% highlight html tabtitle="Standalone" %} -```html - - -
- @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- + +{% endhighlight %} +{% highlight html tabtitle="Server-Backed" %} + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% endtabs %} + +## Adding a Ink annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a Ink annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a Ink annotation programmatically + +{% tabs %} +{% highlight html tabtitle="Standalone" %} + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + + +{% endhighlight %} +{% highlight html tabtitle="Server-Backed" %} + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + + +{% endhighlight %} +{% endtabs %} + +## Edit the existing Ink annotation programmatically + +To modify existing Ink annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight html tabtitle="Standalone" %} + + +
+ + +
+ -``` + } + } + + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html - - -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- -``` + } + } + + {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/measurement-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/measurement-annotation.md index 21bc9d875a..fdfa40393e 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/measurement-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/measurement-annotation.md @@ -1,14 +1,13 @@ --- layout: post -title: Measurement Annotation in ##Platform_Name## Pdfviewer Component -description: Learn here all about Measurement Annotation in Syncfusion ##Platform_Name## Pdfviewer component of Syncfusion Essential JS 2 and more. +title: Measurement Annotation in ##Platform_Name## PDF Viewer Component | Syncfusion +description: Learn here all about Measurement Annotation in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Measurement Annotation publishingplatform: ##Platform_Name## documentation: ug --- - # Measurement Annotation in the ASP.NET MVC PDF Viewer component The PDF Viewer provides the options to add measurement annotations. You can measure the page annotations with the help of measurement annotation. The supported measurement annotations in the PDF Viewer control are: @@ -38,34 +37,318 @@ Refer to the following code sample to switch to the distance annotation mode. {% tabs %} {% highlight html tabtitle="Standalone" %} -```html - - -
- @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- + +{% endhighlight %} +{% highlight html tabtitle="Server-Backed" %} + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% endtabs %} + +## Adding a measurement annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a measurement annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a measurement annotation programmatically: + +{% tabs %} +{% highlight html tabtitle="Standalone" %} + + + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + + +{% endhighlight %} +{% highlight html tabtitle="Server-Backed" %} + + + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + + +{% endhighlight %} +{% endtabs %} + +## Edit the existing measurement annotation programmatically + +To modify existing measurement annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight html tabtitle="Standalone" %} + + + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + -``` + } + function editAreaAnnotation() { + var viewer = document.getElementById('pdfviewer').ej2_instances[0]; + for (let i = 0; i < viewer.annotationCollection.length; i++) { + if (viewer.annotationCollection[i].subject === "Area calculation") { + viewer.annotationCollection[i].annotationSelectorSettings.resizerShape = "Circle" + viewer.annotationCollection[i].strokeColor = "#0000FF"; + viewer.annotationCollection[i].thickness = 2; + viewer.annotationCollection[i].fillColor = "#FFFF00"; + viewer.annotation.editAnnotation(viewer.annotationCollection[i]); + } + } + } + function editRadiusAnnotation() { + var viewer = document.getElementById('pdfviewer').ej2_instances[0]; + for (let i = 0; i < viewer.annotationCollection.length; i++) { + if (viewer.annotationCollection[i].subject === "Radius calculation") { + viewer.annotationCollection[i].annotationSelectorSettings.resizerShape = "Circle" + viewer.annotationCollection[i].strokeColor = "#0000FF"; + viewer.annotationCollection[i].thickness = 2; + viewer.annotationCollection[i].fillColor = "#FFFF00"; + viewer.annotation.editAnnotation(viewer.annotationCollection[i]); + } + } + } + function editVolumeAnnotation() { + var viewer = document.getElementById('pdfviewer').ej2_instances[0]; + for (let i = 0; i < viewer.annotationCollection.length; i++) { + if (viewer.annotationCollection[i].subject === "Volume calculation") { + viewer.annotationCollection[i].annotationSelectorSettings.resizerShape = "Circle" + viewer.annotationCollection[i].strokeColor = "#0000FF"; + viewer.annotationCollection[i].thickness = 2; + viewer.annotationCollection[i].fillColor = "#FFFF00"; + viewer.annotation.editAnnotation(viewer.annotationCollection[i]); + } + } + } + + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html - - -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- -``` + } + function editAreaAnnotation() { + var viewer = document.getElementById('pdfviewer').ej2_instances[0]; + for (let i = 0; i < viewer.annotationCollection.length; i++) { + if (viewer.annotationCollection[i].subject === "Area calculation") { + viewer.annotationCollection[i].annotationSelectorSettings.resizerShape = "Circle" + viewer.annotationCollection[i].strokeColor = "#0000FF"; + viewer.annotationCollection[i].thickness = 2; + viewer.annotationCollection[i].fillColor = "#FFFF00"; + viewer.annotation.editAnnotation(viewer.annotationCollection[i]); + } + } + } + function editRadiusAnnotation() { + var viewer = document.getElementById('pdfviewer').ej2_instances[0]; + for (let i = 0; i < viewer.annotationCollection.length; i++) { + if (viewer.annotationCollection[i].subject === "Radius calculation") { + viewer.annotationCollection[i].annotationSelectorSettings.resizerShape = "Circle" + viewer.annotationCollection[i].strokeColor = "#0000FF"; + viewer.annotationCollection[i].thickness = 2; + viewer.annotationCollection[i].fillColor = "#FFFF00"; + viewer.annotation.editAnnotation(viewer.annotationCollection[i]); + } + } + } + function editVolumeAnnotation() { + var viewer = document.getElementById('pdfviewer').ej2_instances[0]; + for (let i = 0; i < viewer.annotationCollection.length; i++) { + if (viewer.annotationCollection[i].subject === "Volume calculation") { + viewer.annotationCollection[i].annotationSelectorSettings.resizerShape = "Circle" + viewer.annotationCollection[i].strokeColor = "#0000FF"; + viewer.annotationCollection[i].thickness = 2; + viewer.annotationCollection[i].fillColor = "#FFFF00"; + viewer.annotation.editAnnotation(viewer.annotationCollection[i]); + } + } + } + + {% endhighlight %} {% endtabs %} @@ -110,18 +393,18 @@ Refer to the following code sample to set the default annotation settings. {% tabs %} {% highlight html tabtitle="Standalone" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").DistanceSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerDistanceSettings { FillColor = "blue", Opacity = 0.6, StrokeColor = "green" }).PerimeterSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerPerimeterSettings { FillColor = "green", Opacity = 0.6, StrokeColor = "blue" }).AreaSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerAreaSettings { FillColor = "yellow", Opacity = 0.6, StrokeColor = "orange" }).RadiusSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerRadiusSettings { FillColor = "orange", Opacity = 0.6, StrokeColor = "pink" }).VolumeSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerVolumeSettings { FillColor = "pink", Opacity = 0.6, StrokeColor = "yellow" }).Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").DistanceSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerDistanceSettings { FillColor = "blue", Opacity = 0.6, StrokeColor = "green" }).PerimeterSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerPerimeterSettings { FillColor = "green", Opacity = 0.6, StrokeColor = "blue" }).AreaSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerAreaSettings { FillColor = "yellow", Opacity = 0.6, StrokeColor = "orange" }).RadiusSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerRadiusSettings { FillColor = "orange", Opacity = 0.6, StrokeColor = "pink" }).VolumeSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerVolumeSettings { FillColor = "pink", Opacity = 0.6, StrokeColor = "yellow" }).Render() +
+ {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").DistanceSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerDistanceSettings { FillColor = "blue", Opacity = 0.6, StrokeColor = "green" }).PerimeterSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerPerimeterSettings { FillColor = "green", Opacity = 0.6, StrokeColor = "blue" }).AreaSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerAreaSettings { FillColor = "yellow", Opacity = 0.6, StrokeColor = "orange" }).RadiusSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerRadiusSettings { FillColor = "orange", Opacity = 0.6, StrokeColor = "pink" }).VolumeSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerVolumeSettings { FillColor = "pink", Opacity = 0.6, StrokeColor = "yellow" }).Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").DistanceSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerDistanceSettings { FillColor = "blue", Opacity = 0.6, StrokeColor = "green" }).PerimeterSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerPerimeterSettings { FillColor = "green", Opacity = 0.6, StrokeColor = "blue" }).AreaSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerAreaSettings { FillColor = "yellow", Opacity = 0.6, StrokeColor = "orange" }).RadiusSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerRadiusSettings { FillColor = "orange", Opacity = 0.6, StrokeColor = "pink" }).VolumeSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerVolumeSettings { FillColor = "pink", Opacity = 0.6, StrokeColor = "yellow" }).Render() +
+ {% endhighlight %} {% endtabs %} @@ -148,17 +431,17 @@ The properties of scale ratio for measurement annotation can be set before creat {% tabs %} {% highlight html tabtitle="Standalone" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").MeasurementSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerMeasurementSettings { ScaleRatio = 2, ConversionUnit = Syncfusion.EJ2.PdfViewer.CalibrationUnit.Cm }).Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").MeasurementSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerMeasurementSettings { ScaleRatio = 2, ConversionUnit = Syncfusion.EJ2.PdfViewer.CalibrationUnit.Cm }).Render() +
+ {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").MeasurementSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerMeasurementSettings { ScaleRatio = 2, ConversionUnit = Syncfusion.EJ2.PdfViewer.CalibrationUnit.Cm }).Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").MeasurementSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerMeasurementSettings { ScaleRatio = 2, ConversionUnit = Syncfusion.EJ2.PdfViewer.CalibrationUnit.Cm }).Render() +
+ {% endhighlight %} {% endtabs %} \ No newline at end of file diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/shape-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/shape-annotation.md index 905a930bd9..11977a05e8 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/shape-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/shape-annotation.md @@ -1,14 +1,13 @@ --- layout: post -title: Shape Annotation in ##Platform_Name## Pdfviewer Component -description: Learn here all about Shape Annotation in Syncfusion ##Platform_Name## Pdfviewer component of Syncfusion Essential JS 2 and more. +title: Shape Annotation in ##Platform_Name## PDF Viewer Component | Syncfusion +description: Learn here all about Shape Annotation in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Shape Annotation publishingplatform: ##Platform_Name## documentation: ug --- - # Shape Annotation in the ASP.NET MVC PDF Viewer component The PDF Viewer control provides the options to add, edit, and delete the shape annotations. The shape annotation types supported in the PDF Viewer control are: @@ -38,34 +37,316 @@ Refer to the following code sample to switch to the circle annotation mode. {% tabs %} {% highlight html tabtitle="Standalone" %} -```html - - -
- @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- + +{% endhighlight %} +{% highlight html tabtitle="Server-Backed" %} + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% endtabs %} + +## Adding a shape annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a shape annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a shape annotation programmatically: + +{% tabs %} +{% highlight html tabtitle="Standalone" %} + + + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% highlight html tabtitle="Server-Backed" %} + + + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + + +{% endhighlight %} +{% endtabs %} + +## Edit the existing shape annotation programmatically + +To modify existing shape annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight html tabtitle="Standalone" %} + + + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + -``` + } + function editCircleAnnotation() { + var pdfviewer = document.getElementById('pdfviewer').ej2_instances[0]; + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + if (pdfviewer.annotationCollection[i].subject === "Circle") { + pdfviewer.annotationCollection[i].strokeColor = "#0000FF"; + pdfviewer.annotationCollection[i].thickness = 2; + pdfviewer.annotationCollection[i].fillColor = "#FFFF00"; + pdfviewer.annotationCollection[i].annotationSelectorSettings.resizerShape = "Circle" + pdfviewer.annotation.editAnnotation(pdfviewer.annotationCollection[i]); + } + } + } + function editPolygonAnnotation() { + var pdfviewer = document.getElementById('pdfviewer').ej2_instances[0]; + for (let i = 0; i < pdfviewer.annotationCollection.length; i++) { + if (pdfviewer.annotationCollection[i].subject === "Polygon") { + pdfviewer.annotationCollection[i].strokeColor = "#0000FF"; + pdfviewer.annotationCollection[i].thickness = 2; + pdfviewer.annotationCollection[i].fillColor = "#FFFF00"; + pdfviewer.annotationCollection[i].annotationSelectorSettings.resizerShape = "Circle" + pdfviewer.annotation.editAnnotation(pdfviewer.annotationCollection[i]); + } + } + } + + + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html - - -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- -``` + } + + {% endhighlight %} {% endtabs %} @@ -111,17 +392,17 @@ The properties of the shape annotations can be set before creating the control u {% tabs %} {% highlight html tabtitle="Standalone" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").LineSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerLineSettings { FillColor = "blue", Opacity = 0.6, StrokeColor = "green" }).ArrowSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerArrowSettings { FillColor = "green", Opacity = 0.6, StrokeColor = "blue" }).RectangleSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerRectangleSettings { FillColor = "yellow", Opacity = 0.6, StrokeColor = "orange" }).CircleSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerCircleSettings { FillColor = "orange", Opacity = 0.6, StrokeColor = "pink" }).PolygonSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerPolygonSettings { FillColor = "pink", Opacity = 0.6, StrokeColor = "yellow" }).Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").LineSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerLineSettings { FillColor = "blue", Opacity = 0.6, StrokeColor = "green" }).ArrowSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerArrowSettings { FillColor = "green", Opacity = 0.6, StrokeColor = "blue" }).RectangleSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerRectangleSettings { FillColor = "yellow", Opacity = 0.6, StrokeColor = "orange" }).CircleSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerCircleSettings { FillColor = "orange", Opacity = 0.6, StrokeColor = "pink" }).PolygonSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerPolygonSettings { FillColor = "pink", Opacity = 0.6, StrokeColor = "yellow" }).Render() +
+ {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").LineSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerLineSettings { FillColor = "blue", Opacity = 0.6, StrokeColor = "green" }).ArrowSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerArrowSettings { FillColor = "green", Opacity = 0.6, StrokeColor = "blue" }).RectangleSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerRectangleSettings { FillColor = "yellow", Opacity = 0.6, StrokeColor = "orange" }).CircleSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerCircleSettings { FillColor = "orange", Opacity = 0.6, StrokeColor = "pink" }).PolygonSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerPolygonSettings { FillColor = "pink", Opacity = 0.6, StrokeColor = "yellow" }).Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").LineSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerLineSettings { FillColor = "blue", Opacity = 0.6, StrokeColor = "green" }).ArrowSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerArrowSettings { FillColor = "green", Opacity = 0.6, StrokeColor = "blue" }).RectangleSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerRectangleSettings { FillColor = "yellow", Opacity = 0.6, StrokeColor = "orange" }).CircleSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerCircleSettings { FillColor = "orange", Opacity = 0.6, StrokeColor = "pink" }).PolygonSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerPolygonSettings { FillColor = "pink", Opacity = 0.6, StrokeColor = "yellow" }).Render() +
+ {% endhighlight %} {% endtabs %} \ No newline at end of file diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/stamp-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/stamp-annotation.md index 132b02f313..41ac4561fa 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/stamp-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/stamp-annotation.md @@ -1,14 +1,13 @@ --- layout: post -title: Stamp Annotation in ##Platform_Name## Pdfviewer Component -description: Learn here all about Stamp Annotation in Syncfusion ##Platform_Name## Pdfviewer component of Syncfusion Essential JS 2 and more. +title: Stamp Annotation in ##Platform_Name## PDF Viewer Component | Syncfusion +description: Learn here all about Stamp Annotation in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Stamp Annotation publishingplatform: ##Platform_Name## documentation: ug --- - # Stamp Annotation in the ASP.NET MVC PDF Viewer component The PDF Viewer control provides options to add, edit, delete, and rotate the following stamp annotation in the PDF documents: @@ -37,6 +36,63 @@ The stamp annotations can be added to the PDF document using the annotation tool In the pan mode, if the stamp annotation mode is entered, the PDF Viewer control will switch to text select mode. +Refer to the following code sample to switch to the stamp annotation mode. + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% endtabs %} + ## Adding custom stamp to the PDF document * Click the **Edit Annotation** button in the PDF Viewer toolbar. A toolbar appears below it. @@ -49,6 +105,174 @@ In the pan mode, if the stamp annotation mode is entered, the PDF Viewer control N>The JPG and JPEG image format is only supported in the custom stamp annotations. +## Adding a Stamp annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a Stamp annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a Stamp annotation programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% endtabs %} + +## Edit the existing sticky note annotation programmatically + +To modify existing sticky note annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ +{% endhighlight %} +{% endtabs %} + + ## Setting default properties during control initialization The properties of the stamp annotation can be set before creating the control using the StampSettings. @@ -58,17 +282,16 @@ Refer to the following code sample to set the default sticky note annotation set {% tabs %} {% highlight html tabtitle="Standalone" %} -```html +
@Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").StampSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerStampSettings { Opacity = 0.3, Author = "Guest User" }).Render() -
-``` + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html +
@Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").StampSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerStampSettings { Opacity = 0.3, Author = "Guest User" }).Render()
-``` + {% endhighlight %} {% endtabs %} \ No newline at end of file diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/sticky-notes-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/sticky-notes-annotation.md index 70c4820957..c77c5f6063 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/sticky-notes-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/sticky-notes-annotation.md @@ -1,14 +1,13 @@ --- layout: post -title: Sticky Notes Annotation in ##Platform_Name## Pdfviewer Component -description: Learn here all about Sticky Notes Annotation in Syncfusion ##Platform_Name## Pdfviewer component of Syncfusion Essential JS 2 and more. +title: Sticky Notes Annotation in ##Platform_Name## PDF Viewer Component | Syncfusion +description: Learn here all about Sticky Notes Annotation in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Sticky Notes Annotation publishingplatform: ##Platform_Name## documentation: ug --- - # Sticky Notes Annotation in the ASP.NET MVC PDF Viewer component The PDF Viewer control provides the options to add, edit, and delete the sticky note annotations in the PDF document. @@ -34,6 +33,104 @@ Annotation comments can be added to the PDF document using the comment panel. ![StickyNotesComment](../images/stickynotes_comment.png) +## Adding a sticky note annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a sticky note annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a sticky note annotation programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% endtabs %} + +## Edit the existing sticky note annotation programmatically + +To modify existing sticky note annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% endtabs %} + ## Editing the properties of the sticky note annotation ### Editing opacity diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/text-markup-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/text-markup-annotation.md index 3b5f4eb9f9..1db28414c6 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/text-markup-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.MVC/annotation/text-markup-annotation.md @@ -1,6 +1,6 @@ --- layout: post -title: Text Markup Annotation Support in ##Platform_Name## Pdfviewer Component | Syncfusion +title: Text Markup Annotation Support in ##Platform_Name## PDF Viewer Component | Syncfusion description: Learn here all about Text Markup Annotation in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Text Markup Annotation @@ -8,7 +8,6 @@ publishingplatform: ##Platform_Name## documentation: ug --- - # Text Markup Annotation in the ASP.NET MVC PDF Viewer component The PDF Viewer control provides the options to add, edit, and delete text markup annotations such as highlight, underline, and strikethrough annotations in the PDF document. @@ -40,7 +39,7 @@ Refer to the following code sample to switch to the highlight mode. {% tabs %} {% highlight html tabtitle="Standalone" %} -```html +
@@ -52,10 +51,10 @@ Refer to the following code sample to switch to the highlight mode. pdfViewer.annotation.setAnnotationMode('Highlight'); } -``` + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html +
@@ -67,7 +66,7 @@ Refer to the following code sample to switch to the highlight mode. pdfViewer.annotation.setAnnotationMode('Highlight'); } -``` + {% endhighlight %} {% endtabs %} @@ -75,7 +74,7 @@ Refer to the following code sample to switch back to normal mode from the highli {% tabs %} {% highlight html tabtitle="Standalone" %} -```html + @@ -94,10 +93,10 @@ Refer to the following code sample to switch back to normal mode from the highli pdfViewer.annotation.setAnnotationMode('None'); } -``` + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html + @@ -116,10 +115,54 @@ Refer to the following code sample to switch back to normal mode from the highli pdfViewer.annotation.setAnnotationMode('None'); } -``` + {% endhighlight %} {% endtabs %} +## Highlight a text programmatically + +The PDF Viewer library enables you to programmatically highlight text within the PDF Viewer control using the **addAnnotation()** method. + +Here's an example of how you can use the **addAnnotation()** method to apply highlighting programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% endtabs %} + + ## Underline a text There are two ways to underline a text in the PDF document: @@ -145,7 +188,7 @@ Refer to the following code sample to switch to the underline mode. {% tabs %} {% highlight html tabtitle="Standalone" %} -```html +
@@ -157,10 +200,10 @@ Refer to the following code sample to switch to the underline mode. pdfViewer.annotation.setAnnotationMode('Underline'); } -``` + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html +
@@ -172,7 +215,7 @@ Refer to the following code sample to switch to the underline mode. pdfViewer.annotation.setAnnotationMode('Underline'); } -``` + {% endhighlight %} {% endtabs %} @@ -181,7 +224,6 @@ Refer to the following code sample to switch back to normal mode from the underl {% tabs %} {% highlight html tabtitle="Standalone" %} -```html @@ -200,11 +242,10 @@ Refer to the following code sample to switch back to normal mode from the underl pdfViewer.annotation.setAnnotationMode('None'); } -``` + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html @@ -223,7 +264,50 @@ Refer to the following code sample to switch back to normal mode from the underl pdfViewer.annotation.setAnnotationMode('None'); } -``` + +{% endhighlight %} +{% endtabs %} + +## Underline a text programmatically + +The PDF Viewer library enables you to programmatically Underline text within the PDF Viewer control using the **addAnnotation()** method. + +Here's an example of how you can use the **addAnnotation()** method to apply Underline programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + {% endhighlight %} {% endtabs %} @@ -253,7 +337,7 @@ Refer to the following code sample to switch to the strikethrough mode. {% tabs %} {% highlight html tabtitle="Standalone" %} -```html +
@@ -265,11 +349,11 @@ Refer to the following code sample to switch to the strikethrough mode. pdfViewer.annotation.setAnnotationMode('Strikethrough'); } -``` + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html +
@@ -281,7 +365,7 @@ Refer to the following code sample to switch to the strikethrough mode. pdfViewer.annotation.setAnnotationMode('Strikethrough'); } -``` + {% endhighlight %} {% endtabs %} @@ -289,7 +373,7 @@ Refer to the following code sample to switch back to normal mode from the strike {% tabs %} {% highlight html tabtitle="Standalone" %} -```html + @@ -308,10 +392,10 @@ Refer to the following code sample to switch back to normal mode from the strike pdfViewer.annotation.setAnnotationMode('None'); } -``` + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html + @@ -330,7 +414,50 @@ Refer to the following code sample to switch back to normal mode from the strike pdfViewer.annotation.setAnnotationMode('None'); } -``` + +{% endhighlight %} +{% endtabs %} + +## Strikethrough a text programmatically + +The PDF Viewer library enables you to programmatically Strikethrough text within the PDF Viewer control using the **addAnnotation()** method. + +Here's an example of how you can use the **addAnnotation()** method to apply Strikethrough programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + {% endhighlight %} {% endtabs %} @@ -374,18 +501,18 @@ Refer to the following code sample to set the default annotation settings. {% tabs %} {% highlight html tabtitle="Standalone" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").HighlightSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerHighlightSettings{Author = "Guest User", Color = "#ffff00", Opacity = 0.9 }).UnderlineSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerUnderlineSettings{ Author = "Guest User", Color = "#00ffff", Opacity = 0.9 }).StrikethroughSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerStrikethroughSettings{ Author = "Guest User", Color = "#ff00ff", Opacity = 0.9, }).Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").HighlightSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerHighlightSettings{Author = "Guest User", Color = "#ffff00", Opacity = 0.9 }).UnderlineSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerUnderlineSettings{ Author = "Guest User", Color = "#00ffff", Opacity = 0.9 }).StrikethroughSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerStrikethroughSettings{ Author = "Guest User", Color = "#ff00ff", Opacity = 0.9, }).Render() +
+ {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").HighlightSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerHighlightSettings{Author = "Guest User", Color = "#ffff00", Opacity = 0.9 }).UnderlineSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerUnderlineSettings{ Author = "Guest User", Color = "#00ffff", Opacity = 0.9 }).StrikethroughSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerStrikethroughSettings{ Author = "Guest User", Color = "#ff00ff", Opacity = 0.9, }).Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").HighlightSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerHighlightSettings{Author = "Guest User", Color = "#ffff00", Opacity = 0.9 }).UnderlineSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerUnderlineSettings{ Author = "Guest User", Color = "#00ffff", Opacity = 0.9 }).StrikethroughSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerStrikethroughSettings{ Author = "Guest User", Color = "#ff00ff", Opacity = 0.9, }).Render() +
+ {% endhighlight %} {% endtabs %} @@ -408,48 +535,48 @@ Refer to the following code sample for calling undo and redo actions from the cl {% tabs %} {% highlight html tabtitle="Standalone" %} -```html - - - - -
- @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- -``` + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html - - - - -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
- -``` + + + + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ + {% endhighlight %} {% endtabs %} @@ -467,17 +594,17 @@ The PDF Viewer control provides an option to disable the text markup annotation {% tabs %} {% highlight html tabtitle="Standalone" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").EnableTextMarkupAnnotation(false).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").EnableTextMarkupAnnotation(false).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ {% endhighlight %} {% highlight html tabtitle="Server-Backed" %} -```html -
- @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).EnableTextMarkupAnnotation(false).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() -
-``` + +
+ @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).EnableTextMarkupAnnotation(false).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render() +
+ {% endhighlight %} {% endtabs %} \ No newline at end of file diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/comments.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/comments.md index 47c9fa0d8e..09b461d471 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/comments.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/comments.md @@ -1,14 +1,13 @@ --- layout: post -title: Comments in ##Platform_Name## Pdfviewer Component -description: Learn here all about Comments in Syncfusion ##Platform_Name## Pdfviewer component of Syncfusion Essential JS 2 and more. +title: Comments in ##Platform_Name## PDF Viewer Component | Syncfusion +description: Learn here all about Comments in Syncfusion ##Platform_Name## PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Comments publishingplatform: ##Platform_Name## documentation: ug --- - # Comments in the ASP.NET Core PDF Viewer component The PDF Viewer control provides options to add, edit, and delete the comments to the following annotation in the PDF documents: diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/free-text-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/free-text-annotation.md index f2965c1995..39abd99c1d 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/free-text-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/free-text-annotation.md @@ -4,11 +4,10 @@ title: Free Text Annotation in EJ2 ASP.NET CORE PDF Viewer | Syncfusion description: Learn here all about Free Text Annotation in ASP.NET CORE PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Free Text Annotation -publishingplatform: ej2-asp-core-mvc +publishingplatform: ##Platform_Name## documentation: ug --- - # Free Text Annotation in the ASP.NET Core PDF Viewer component The PDF Viewer control provides the options to add, edit, and delete the free text annotations. @@ -67,6 +66,140 @@ Refer to the following code sample to switch to the Free Text annotation mode. {% endhighlight %} {% endtabs %} +## Adding a free text annotation programmatically to the PDF document + +The PDF Viewer library allows you to add the free text annotation in the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here is an example of how you can use the **addAnnotation()** method to move the free text annotation programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + +## Change the content of an existing Free text annotation programmatically + +To change the content of an existing free text annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method to change the content of a free text annotation: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + ## Editing the properties of free text annotation The font family, font size, font styles, font color, text alignment, fill color, the border stroke color, border thickness, and opacity of the free text annotation can be edited using the Font Family tool, Font Size tool, Font Color tool, Text Align tool, Font Style tool Edit Color tool, Edit Stroke Color tool, Edit Thickness tool, and Edit Opacity tool in the annotation toolbar. diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/ink-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/ink-annotation.md index 62110b924f..7f48558926 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/ink-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/ink-annotation.md @@ -4,11 +4,10 @@ title: Ink Annotation in EJ2 ASP.NET CORE PDF Viewer | Syncfusion description: Learn here all about Ink Annotation in ASP.NET CORE PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Ink Annotation -publishingplatform: ej2-asp-core-mvc +publishingplatform: ##Platform_Name## documentation: ug --- - # Ink Annotation in the ASP.NET Core PDF Viewer component The PDF Viewer control provides the options to add, edit, and delete the ink annotations. @@ -67,6 +66,128 @@ Refer to the following code sample to switch to the ink annotation mode. {% endhighlight %} {% endtabs %} +## Adding a Ink annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a Ink annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a Ink annotation programmatically + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + +## Edit the existing Ink annotation programmatically + +To modify existing Ink annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + ## Editing the properties of the ink annotation The stroke color, thickness, and opacity of the ink annotation can be edited using the Edit stroke color tool, Edit thickness tool, and Edit opacity tool in the annotation toolbar. diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/measurement-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/measurement-annotation.md index 75bb386972..9acf3f9ff6 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/measurement-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/measurement-annotation.md @@ -4,11 +4,10 @@ title: Measurement Annotation in EJ2 ASP.NET CORE PDF Viewer | Syncfusion description: Learn here all about Measurement Annotation in ASP.NET CORE PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Measurement Annotation -publishingplatform: ej2-asp-core-mvc +publishingplatform: ##Platform_Name## documentation: ug --- - # Measurement Annotation in the ASP.NET Core PDF Viewer component The PDF Viewer provides the options to add measurement annotations. You can measure the page annotations with the help of measurement annotation. The supported measurement annotations in the PDF Viewer control are: @@ -73,6 +72,297 @@ Refer to the following code sample to switch to the distance annotation mode. } +{% endhighlight %} +{% endtabs %} + +## Adding a measurement annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a measurement annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a measurement annotation programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + + + + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + + + + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + +## Edit the existing measurement annotation programmatically + +To modify existing measurement annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + + + + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + + + + + +
+ + +
+ + + {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/shape-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/shape-annotation.md index deae576eaa..c137d4610b 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/shape-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/shape-annotation.md @@ -4,7 +4,7 @@ title: Shape Annotation in EJ2 ASP.NET CORE PDF Viewer | Syncfusion description: Learn here all about Shape Annotation in ASP.NET CORE PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Shape Annotation -publishingplatform: ej2-asp-core-mvc +publishingplatform: ##Platform_Name## documentation: ug --- @@ -75,6 +75,296 @@ Refer to the following code sample to switch to the circle annotation mode. {% endhighlight %} {% endtabs %} +## Adding a shape annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a shape annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a shape annotation programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + + + + + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + + + + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + +## Edit the existing shape annotation programmatically + +To modify existing shape annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + + + + + +
+ + +
+ + + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + + + + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + ## Editing the properties of the shape annotation The fill color, stroke color, thickness, and opacity of the shape annotation can be edited using the Edit color tool, Edit stroke color tool, Edit thickness tool, and Edit opacity tool in the annotation toolbar. diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/stamp-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/stamp-annotation.md index cd93704c3f..cf15dccb73 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/stamp-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/stamp-annotation.md @@ -4,11 +4,10 @@ title: Stamp Annotation in EJ2 ASP.NET CORE PDF Viewer | Syncfusion description: Learn here all about Stamp Annotation in ASP.NET CORE PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Stamp Annotation -publishingplatform: ej2-asp-core-mvc +publishingplatform: ##Platform_Name## documentation: ug --- - # Stamp Annotation in the ASP.NET Core PDF Viewer Control The PDF Viewer control provides options to add, edit, delete, and rotate the following stamp annotation in the PDF documents: @@ -37,6 +36,72 @@ The stamp annotations can be added to the PDF document using the annotation tool In the pan mode, if the stamp annotation mode is entered, the PDF Viewer control will switch to text select mode. +Refer to the following code sample to switch to the stamp annotation mode. + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + + + + +
+ + +
+ + + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + + + + +
+ + +
+ + + +{% endhighlight %} +{% endtabs %} + ## Adding custom stamp to the PDF document * Click the **Edit Annotation** button in the PDF Viewer toolbar. A toolbar appears below it. @@ -49,6 +114,187 @@ In the pan mode, if the stamp annotation mode is entered, the PDF Viewer control N>The JPG and JPEG image format is only supported in the custom stamp annotations. +## Adding a Stamp annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a Stamp annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a Stamp annotation programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + + + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + + + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + +## Edit the existing sticky note annotation programmatically + +To modify existing sticky note annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ +{% endhighlight %} +{% endtabs %} + ## Setting default properties during control initialization The properties of the stamp annotation can be set before creating the control using the StampSettings. diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/sticky-notes-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/sticky-notes-annotation.md index a33e6c17f6..a3e7d84884 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/sticky-notes-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/sticky-notes-annotation.md @@ -4,11 +4,10 @@ title: Sticky Notes Annotation in EJ2 ASP.NET CORE PDF Viewer | Syncfusion description: Learn here all about Sticky Notes Annotation in ASP.NET CORE PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Sticky Notes Annotation -publishingplatform: ej2-asp-core-mvc +publishingplatform: ##Platform_Name## documentation: ug --- - # Sticky Notes Annotation in the ASP.NET Core PDF Viewer component The PDF Viewer control provides the options to add, edit, and delete the sticky note annotations in the PDF document. @@ -54,6 +53,118 @@ You can modify or delete the comments or comments replay and it’s status using ![StickyNotesEdit](../../pdfviewer/images/sticky_editbtn.png) +## Adding a sticky note annotation to the PDF document Programmatically + +With the PDF Viewer library, you can add a sticky note annotation to the PDF Viewer control programmatically using the **addAnnotation()** method. + +Here's a example of how you can utilize the **addAnnotation()** method to include a sticky note annotation programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + +## Edit the existing sticky note annotation programmatically + +To modify existing sticky note annotation in the Syncfusion PDF viewer programmatically, you can use the **editAnnotation()** method. + +Here is an example of how you can use the **editAnnotation()** method: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + ## Setting default properties during the control initialization The properties of the sticky note annotation can be set before creating the control using the StickyNotesSettings. diff --git a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/text-markup-annotation.md b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/text-markup-annotation.md index cb47b36421..451a76fd9d 100644 --- a/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/text-markup-annotation.md +++ b/ej2-asp-core-mvc/pdfviewer/EJ2_ASP.NETCORE/annotation/text-markup-annotation.md @@ -4,7 +4,7 @@ title: Text Markup Annotation in EJ2 ASP.NET CORE PDF Viewer | Syncfusion description: Learn here all about Text Markup Annotation in ASP.NET CORE PDF Viewer component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Text Markup Annotation -publishingplatform: ej2-asp-core-mvc +publishingplatform: ##Platform_Name## documentation: ug --- @@ -135,6 +135,56 @@ Refer to the following code sample to switch back to normal mode from the highli {% endhighlight %} {% endtabs %} +## Highlight a text programmatically + +The PDF Viewer library enables you to programmatically highlight text within the PDF Viewer control using the **addAnnotation()** method. + +Here's an example of how you can use the **addAnnotation()** method to apply highlighting programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + ## Underline a text There are two ways to underline a text in the PDF document: @@ -256,6 +306,56 @@ Refer to the following code sample to switch back to normal mode from the underl {% endhighlight %} {% endtabs %} +## Underline a text programmatically + +The PDF Viewer library enables you to programmatically Underline text within the PDF Viewer control using the **addAnnotation()** method. + +Here's an example of how you can use the **addAnnotation()** method to apply Underline programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + ## Strikethrough a text There are two ways to strikethrough a text in the PDF document: @@ -377,6 +477,56 @@ Refer to the following code sample to switch back to normal mode from the strike {% endhighlight %} {% endtabs %} +## Strikethrough a text programmatically + +The PDF Viewer library enables you to programmatically Strikethrough text within the PDF Viewer control using the **addAnnotation()** method. + +Here's an example of how you can use the **addAnnotation()** method to apply Strikethrough programmatically: + +{% tabs %} +{% highlight cshtml tabtitle="Standalone" %} + + +
+ + +
+ + +{% endhighlight %} +{% highlight cshtml tabtitle="Server-Backed" %} + + +
+ + +
+ + +{% endhighlight %} +{% endtabs %} + ## Deleting a text markup annotation The selected annotation can be deleted in the following ways: