Latest source merged from Syncfusion
|
@ -101,6 +101,224 @@ If you need to change your application theme and UI design in the future, do not
|
|||
|
||||
The following list of common variables is used in the Syncfusion Blazor library themes for all UI components. You can change these variables to customize the corresponding theme.
|
||||
|
||||
### Syncfusion Blazor Bootstrap 5 Theme
|
||||
|
||||
<table>
|
||||
<style>
|
||||
.circle-color-indicator {
|
||||
width: 1.5em;
|
||||
height: 1.5em;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
border: 1px solid rgba(0, 0, 0, .08);
|
||||
vertical-align: middle;
|
||||
}
|
||||
th, td {
|
||||
text-align: left;
|
||||
padding: 5px 15px;
|
||||
vertical-align: top;
|
||||
}
|
||||
</style>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Value (Default Theme) </th>
|
||||
<th>Value (Dark Theme) </th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>$black</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #000"></span> #000
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #000"></span> #000
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$white</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #fff"></span> #fff
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #fff"></span> #fff
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$gray-100</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #f8f9fa"></span> #f8f9fa
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #f8f9fa"></span> #f8f9fa
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$gray-200</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #e9ecef"></span> #e9ecef
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #e9ecef"></span> #e9ecef
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$gray-300</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #dee2e6"></span> #dee2e6
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #dee2e6"></span> #dee2e6
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$gray-400</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #ced4da"></span> #ced4da
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #ced4da"></span> #ced4da
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$gray-500</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #adb5bd"></span> #adb5bd
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #adb5bd"></span> #adb5bd
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$gray-600</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #6c757d"></span> #6c757d
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #6c757d"></span> #6c757d
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$gray-700</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #495057"></span> #495057
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #495057"></span> #495057
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$gray-800</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #343a40"></span> #343a40
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #343a40"></span> #343a40
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$gray-900</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #212529"></span> #212529
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #212529"></span> #212529
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$blue</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #0d6efd"></span> #0d6efd
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #0d6efd"></span> #0d6efd
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$indigo</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #6610f2"></span> #6610f2
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #6610f2"></span> #6610f2
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$purple</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #6f42c1"></span> #6f42c1
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #6f42c1"></span> #6f42c1
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$pink</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #d63384"></span> #d63384
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #d63384"></span> #d63384
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$red</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #dc3545"></span> #dc3545
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #dc3545"></span> #dc3545
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$orange</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #fd7e14"></span> #fd7e14
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #fd7e14"></span> #fd7e14
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$yellow</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #ffc107"></span> #ffc107
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #ffc107"></span> #ffc107
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$green</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #198754"></span> #198754
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #198754"></span> #198754
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$teal</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #20c997"></span> #20c997
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #20c997"></span> #20c997
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>$cyan</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #0dcaf0"></span> #0dcaf0
|
||||
</td>
|
||||
<td>
|
||||
<span class="circle-color-indicator" style="background: #0dcaf0"></span> #0dcaf0
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
### Syncfusion Blazor Bootstrap 4 Theme
|
||||
|
||||
<table>
|
||||
|
@ -1663,7 +1881,6 @@ The following list of common variables is used in the Syncfusion Blazor library
|
|||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
### Syncfusion Blazor Tailwind CSS Theme
|
||||
|
||||
<table>
|
||||
|
@ -2106,4 +2323,3 @@ The following list of common variables is used in the Syncfusion Blazor library
|
|||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
---
|
||||
layout: post
|
||||
title: Version Compatibility in Blazor - Syncfusion
|
||||
description: Check out the documentation for Version Compatibility in Blazor
|
||||
description: Check out here the documentation for Version Compatibility support in Syncfusion Blazor NuGet packages
|
||||
platform: Blazor
|
||||
component: Common
|
||||
documentation: ug
|
||||
|
@ -11,10 +11,10 @@ documentation: ug
|
|||
|
||||
## Version Information
|
||||
|
||||
Syncfusion Blazor component follows sequence-based identifiers to process software releases based on the **Major.Minor.Build.Revision** format to track all the release changes. It helps other developers to keep track of our changes in every release. For example, if we release a package version as `18.4.0.43`, the version numbers will be indicated like below.
|
||||
Syncfusion Blazor component follows sequence-based identifiers to process software releases based on the **Major.Minor.Build.Revision** format to track all the release changes. It helps other developers to keep track of our changes in every release. For example, if we release a package version as `19.3.0.43`, the version numbers will be indicated like below.
|
||||
|
||||
> * **18** as `Major release` – Which changes every year.
|
||||
> * **4** as `Volume release` – We release a new Volume once every three months, and this is the fourth release for this year.
|
||||
> * **19** as `Major release` – Which changes every year.
|
||||
> * **3** as `Volume release` – We release a new Volume once every three months, and this is the fourth release for this year.
|
||||
> * **0** as `Build Number` - Particular Build Number is mentioned and it will always be marked as zero.
|
||||
> * **43** as `Patch Number` - Particular Service Pack release or Patch release number, it increases every release.
|
||||
|
||||
|
@ -24,95 +24,17 @@ The following table describes the version compatibility of .NET Core SDK and Syn
|
|||
|
||||
| .NET Core SDK Version | Syncfusion.Blazor NuGet version |
|
||||
| ------------- | ------------- |
|
||||
| [.NET Core 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 18.4.0.39 |
|
||||
| [.NET Core 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 18.4.0.35 |
|
||||
| [.NET Core 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 18.4.0.34 |
|
||||
| [.NET Core 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 18.4.0.33 |
|
||||
| [.NET Core 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 18.4.0.32 |
|
||||
| [.NET Core 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 18.4.0.31 |
|
||||
| [.NET Core 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 18.4.0.30 |
|
||||
| [.NET Core 5.0 - RC2](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-2/) | 18.3.0.53 |
|
||||
| [.NET Core 5.0 - RC2](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-2/) | 18.3.0.52 |
|
||||
| [.NET Core 5.0 - RC2](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-2/) | 18.3.0.51 |
|
||||
| [.NET Core 5.0 - RC2](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-2/) | 18.3.0.50 |
|
||||
| [.NET Core 5.0 - RC2](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-2/) | 18.3.0.48 |
|
||||
| [.NET Core 5.0 - RC2](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-2/) | 18.3.0.47 |
|
||||
| [.NET Core 5.0 - RC1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-1/) | 18.3.0.42 |
|
||||
| [.NET Core 5.0 - RC1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-1/) | 18.3.0.41 |
|
||||
| [.NET Core 5.0 - RC1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-1/) | 18.3.0.40 |
|
||||
| [.NET Core 5.0 - RC1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-1/) | 18.3.0.38 |
|
||||
| [.NET Core 5.0 - RC1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-1/) | 18.3.0.35 |
|
||||
| [.NET Core 5.0 Preview 8](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-8/) | 18.2.0.59 |
|
||||
| [.NET Core 5.0 Preview 8](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-8/) | 18.2.0.58 |
|
||||
| [.NET Core 5.0 Preview 8](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-8/) | 18.2.0.57 |
|
||||
| [.NET Core 5.0 Preview 8](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-8/) | 18.2.0.56 |
|
||||
| [.NET Core 5.0 Preview 7](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-7/) | 18.2.0.55 |
|
||||
| [.NET Core 5.0 Preview 7](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-7/) | 18.2.0.54 |
|
||||
| [.NET Core 5.0 Preview 6](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-6/) | 18.2.0.48 |
|
||||
| [.NET Core 5.0 Preview 6](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-6/) | 18.2.0.47 |
|
||||
| [.NET Core 5.0 Preview 6](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-6/) | 18.2.0.46 |
|
||||
| [.NET Core 5.0 Preview 6](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-6/) | 18.2.0.45 |
|
||||
| [.NET Core 5.0 Preview 6](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-6/) | 18.2.0.44 |
|
||||
| [.NET Core 3.1.4](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-now-available/) | 18.1.0.59 |
|
||||
| [.NET Core 3.1.4](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-now-available/) | 18.1.0.58 |
|
||||
| [.NET Core 3.1.4](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-now-available/) | 18.1.0.57 |
|
||||
| [.NET Core 3.1.4](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-now-available/) | 18.1.0.56 |
|
||||
| [.NET Core 3.1.4](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-now-available/) | 18.1.0.55 |
|
||||
| [.NET Core 3.1.4](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-now-available/) | 18.1.0.54 |
|
||||
| [.NET Core 3.1.3](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-release-candidate-now-available/) | 18.1.0.53 |
|
||||
| [.NET 6.0 - RC1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-6-rc-1/) | 19.3.0.43 |
|
||||
| [.NET 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 19.2.0.55 |
|
||||
| [.NET 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 19.2.0.44 |
|
||||
| [.NET 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 19.1.0.63 |
|
||||
| [.NET 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 19.1.0.54 |
|
||||
| [.NET 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 18.4.0.39 |
|
||||
| [.NET 5.0](https://devblogs.microsoft.com/aspnet/announcing-asp-net-core-in-net-5/) | 18.4.0.30 |
|
||||
| [.NET 5.0 - RC2](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-2/) | 18.3.0.47 |
|
||||
| [.NET 5.0 - RC1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-1/) | 18.3.0.35 |
|
||||
| [.NET 5.0 Preview 6](https://devblogs.microsoft.com/dotnet/announcing-net-5-0-preview-6/) | 18.2.0.44 |
|
||||
| [.NET Core 3.1.3](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-release-candidate-now-available/) | 18.1.0.52 |
|
||||
| [.NET Core 3.1.3](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-release-candidate-now-available/) | 18.1.0.48 |
|
||||
| [.NET Core 3.1.3](https://devblogs.microsoft.com/dotnet/net-core-march-2020/) | 18.1.0.46 |
|
||||
| [.NET Core 3.1.3](https://devblogs.microsoft.com/dotnet/net-core-march-2020/) | 18.1.0.45 |
|
||||
| [.NET Core 3.1.3](https://devblogs.microsoft.com/dotnet/net-core-march-2020/) | 18.1.0.44 |
|
||||
| [.NET Core 3.1.3](https://devblogs.microsoft.com/dotnet/net-core-march-2020/) | 18.1.0.43 |
|
||||
| [.NET Core 3.1.2](https://devblogs.microsoft.com/dotnet/net-core-february-2020/) | 18.1.0.42 |
|
||||
| [.NET Core 3.1.2](https://devblogs.microsoft.com/dotnet/net-core-february-2020/) | 18.1.0.36 |
|
||||
| [.NET Core 3.1.2](https://devblogs.microsoft.com/dotnet/net-core-february-2020/) | 17.4.0.55 |
|
||||
| [.NET Core 3.1.2](https://devblogs.microsoft.com/dotnet/net-core-february-2020/) | 17.4.0.54 |
|
||||
| [.NET Core 3.1.2](https://devblogs.microsoft.com/dotnet/net-core-february-2020/) | 17.4.0.53 |
|
||||
| [.NET Core 3.1.1](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-preview-1-release-now-available/) | 17.4.0.51 |
|
||||
| [.NET Core 3.1.1](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-preview-1-release-now-available/) | 17.4.0.50 |
|
||||
| [.NET Core 3.1.1](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-preview-1-release-now-available/) | 17.4.0.49 |
|
||||
| [.NET Core 3.1.1](https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-preview-1-release-now-available/) | 17.4.0.47 |
|
||||
| [.NET Core 3.1.1](https://devblogs.microsoft.com/dotnet/net-core-january-2020/) | 17.4.0.46 |
|
||||
| [.NET Core 3.1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1/) | 17.4.0.44 |
|
||||
| [.NET Core 3.1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1/) | 17.4.0.43 |
|
||||
| [.NET Core 3.1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1/) | 17.4.0.42 |
|
||||
| [.NET Core 3.1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1/) | 17.4.0.41 |
|
||||
| [.NET Core 3.1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1/) | 17.4.0.40 |
|
||||
| [.NET Core 3.1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1/) | 17.4.0.39 |
|
||||
| [.NET Core 3.1 Preview 3](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1-preview-3/) | 17.3.0.28-beta |
|
||||
| [.NET Core 3.1 Preview 2](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1-preview-2/) | 17.3.0.27-beta |
|
||||
| [.NET Core 3.1 Preview 1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1-preview-1/) | 17.3.0.26-beta |
|
||||
| [.NET Core 3.1 Preview 1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1-preview-1/) | 17.3.0.21-beta |
|
||||
| [.NET Core 3.1 Preview 1](https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-core-3-1-preview-1/) | 17.3.0.19-beta |
|
||||
| [.NET Core 3.0](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0/) | 17.3.0.18-beta |
|
||||
| [.NET Core 3.0](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0/) | 17.3.0.17-beta |
|
||||
| [.NET Core 3.0](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0/) | 17.3.0.11-beta |
|
||||
| [.NET Core 3.0](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0/) | 17.3.0.10-beta |
|
||||
| [.NET Core 3.0 RC1](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-release-candidate-1/) | 17.2.0.52-beta |
|
||||
| [.NET Core 3.0 Preview 9](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-9/) | 17.2.0.50-beta |
|
||||
| [.NET Core 3.0 Preview 8](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-8/) | 17.2.0.49-beta |
|
||||
| [.NET Core 3.0 Preview 8](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-8/) | 17.2.0.47-beta |
|
||||
| [.NET Core 3.0 Preview 8](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-8/) | 17.2.0.46-beta |
|
||||
| [.NET Core 3.0 Preview 7](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-7/) | 17.2.0.40-beta |
|
||||
| [.NET Core 3.0 Preview 7](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-7/) | 17.2.0.39-beta |
|
||||
| [.NET Core 3.0 Preview 6](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-6/) | 17.2.0.35-beta |
|
||||
| [.NET Core 3.0 Preview 6](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-6/) | 17.2.0.34-beta |
|
||||
| [.NET Core 3.0 Preview 6](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-6/) | 17.2.0.30-beta |
|
||||
| [.NET Core 3.0 Preview 6](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-6/) | 17.2.0.29-beta |
|
||||
| [.NET Core 3.0 Preview 6](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-6/) | 17.2.0.28-beta |
|
||||
| [.NET Core 3.0 Preview 6](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-6/) | 17.1.0.53-beta |
|
||||
| [.NET Core 3.0 Preview 6](https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-6/) | 17.1.0.52-beta |
|
||||
| .NET Core 3.0 Preview 5 | 17.1.0.51-beta |
|
||||
| .NET Core 3.0 Preview 5 | 17.1.0.50-beta |
|
||||
| .NET Core 3.0 Preview 5 | 17.1.0.49-beta |
|
||||
| .NET Core 3.0 Preview 5 | 17.1.0.48-beta |
|
||||
| .NET Core 3.0 Preview 5 | 17.1.0.47-beta |
|
||||
| .NET Core 3.0 Preview 4 | 17.1.0.44-beta |
|
||||
| .NET Core 3.0 Preview 4 | 17.1.0.43-beta |
|
||||
| .NET Core 3.0 Preview 3 | 17.1.0.42 |
|
||||
| .NET Core 3.0 Preview 3 | 17.1.0.38-beta |
|
||||
| .NET Core 3.0 Preview 3 | 17.1.0.34-beta |
|
||||
| .NET Core 3.0 Preview | 17.1.0.32-beta |
|
|
@ -21,24 +21,24 @@ Steps to get started with Word processor component for Blazor:
|
|||
|
||||
2. Select **Create a new project** from the Visual Studio dashboard.
|
||||
|
||||
![new project in blazor](../images/new-project.png)
|
||||
![Creating New Project in Blazor](../images/blazor-create-new-project.png)
|
||||
|
||||
3. Select **Blazor App** from the template and click the **Next** button.
|
||||
|
||||
![Blazor app](../images/blazor-template.png)
|
||||
![Creating Blazor Application](../images/blazor-template.png)
|
||||
|
||||
4. In the project configuration window, click the **Create** button to create a new project with the default project configuration.
|
||||
|
||||
![Blazor project configuration](../images/project-configuration.png)
|
||||
![Blazor Project Configuration](../images/blazor-project-configuration.png)
|
||||
|
||||
5. Select **Blazor WebAssembly App** from the dashboard and click **Create** button to create a new Blazor client-side application. Make sure that **.NET Core** and **ASP.NET Core 3.1** are selected at the top.
|
||||
|
||||
![select framework](../images/blazor-client-template.png)
|
||||
![Selecting Blazor WebAssembly Framework](../images/blazor-client-template.png)
|
||||
|
||||
6. Install the [Syncfusion.Blazor.WordProcessor](https://www.nuget.org/packages/Syncfusion.Blazor.WordProcessor/) NuGet package from NuGet.org to the newly created application by using the **NuGet Package Manager**. Right-click the project and select Manage NuGet Packages.
|
||||
|
||||
7. Search **Syncfusion.Blazor.WordProcessor** keyword in the Browse tab and install [Syncfusion.Blazor.WordProcessor](https://www.nuget.org/packages/Syncfusion.Blazor.WordProcessor/) NuGet package in the application.
|
||||
![select nuget](../images/select-nuget.png)
|
||||
![Searching Blazor DocumentEditor NuGet Package](../images/blazor-document-editor-nuget.png)
|
||||
|
||||
8. Open the **~/_Imports.razor** file and import the ``Syncfusion.Blazor.DocumentEditor``.
|
||||
|
||||
|
@ -85,6 +85,6 @@ Steps to get started with Word processor component for Blazor:
|
|||
|
||||
12. Run the application. The Word processor component will be rendered in the web browser.
|
||||
|
||||
![DocumentEditor Sample](../images/browser-output.png)
|
||||
![Blazor DocumentEditor](../images/blazor-document-editor.png)
|
||||
|
||||
You can also explore our [Blazor Word Processor](https://blazor.syncfusion.com/demos/document-editor/default-functionalities) example to know how to render and configure the document editor.
|
||||
|
|
|
@ -15,25 +15,25 @@ Steps to get started with Word processor component for Blazor:
|
|||
|
||||
1. Select **Create a new project** from the Visual Studio dashboard.
|
||||
|
||||
![new project in blazor](../images/new-project.png)
|
||||
![Creating New Project in Blazor](../images/blazor-create-new-project.png)
|
||||
|
||||
2. Select **Blazor App** from the template and click the **Next** button.
|
||||
|
||||
![Blazor app](../images/blazor-template.png)
|
||||
![Creating Blazor Application](../images/blazor-template.png)
|
||||
|
||||
3. In the project configuration window, click the **Create** button to create a new project with the default project configuration.
|
||||
|
||||
![asp.net core project configuration](../images/project-configuration.png)
|
||||
![Blazor Project Configuration](../images/blazor-project-configuration.png)
|
||||
|
||||
4. Select **Blazor Server App** from the dashboard and click the **Create** button to create a new Blazor Server application. Make sure that **.NET Core** and **ASP.NET Core 3.1** are selected at the top.
|
||||
|
||||
![select framework](../images/blazor-server-template.png)
|
||||
![Select Blazor Server Application Framework](../images/blazor-server-template.png)
|
||||
|
||||
5. Install the [Syncfusion.Blazor.WordProcessor](https://www.nuget.org/packages/Syncfusion.Blazor.WordProcessor/) NuGet package to the newly created application by using the **NuGet Package Manager**. Right-click the project and select Manage NuGet Packages.
|
||||
|
||||
6. Search **Syncfusion.Blazor.WordProcessor** keyword in the Browse tab and install [Syncfusion.Blazor.WordProcessor](https://www.nuget.org/packages/Syncfusion.Blazor.WordProcessor/) NuGet package in the application.
|
||||
|
||||
![select nuget](../images/select-nuget.png)
|
||||
![Searching Blazor DocumentEditor NuGet Package](../images/blazor-document-editor-nuget.png)
|
||||
|
||||
7. Open the **~/_Imports.razor** file and import the `Syncfusion.Blazor.DocumentEditor`.
|
||||
|
||||
|
@ -69,7 +69,7 @@ Steps to get started with Word processor component for Blazor:
|
|||
|
||||
11. Run the application. The Word processor component will be rendered in the web browser.
|
||||
|
||||
![DocumentEditor Sample](../images/browser-output.png)
|
||||
![Blazor DocumentEditor](../images/blazor-document-editor.png)
|
||||
|
||||
12. To load an existing document during control initialization, use the following code example, which opens a Word document. Convert it to SFDT and load in the editor.
|
||||
|
||||
|
@ -105,4 +105,4 @@ Steps to get started with Word processor component for Blazor:
|
|||
|
||||
> As per the discussion thread [#30064](https://github.com/dotnet/aspnetcore/issues/30064), please null out the reference of streams and other instances when they are no longer required. Using this approach you'll observe the memory go down and become stable.
|
||||
|
||||
![DocumentEditor Sample](../images/browser-output-open-document.png)
|
||||
![Blazor DocumentEditor](../images/blazor-document-editor-component.png)
|
|
@ -21,7 +21,7 @@ Image files will be internally converted to base64 string. Whereas, online image
|
|||
|
||||
Document editor provides built-in image resizer that can be injected into your application based on the requirements. This allows you to resize the image by dragging the resizing points using mouse or touch interactions. This resizer appears as follows.
|
||||
|
||||
![Image](images/image.jpeg)
|
||||
![Image Resizing in Blazor DocumentEditor](images/blazor-document-editor-image-resizing.jpeg)
|
||||
|
||||
## Changing size
|
||||
|
||||
|
|
После Ширина: | Высота: | Размер: 35 KiB |
После Ширина: | Высота: | Размер: 78 KiB |
Двоичные данные
blazor/document-editor/images/blazor-document-editor-disable-edit-restriction.png
Normal file
После Ширина: | Высота: | Размер: 64 KiB |
Двоичные данные
blazor/document-editor/images/blazor-document-editor-enable-edit-restriction.png
Normal file
После Ширина: | Высота: | Размер: 72 KiB |
Двоичные данные
blazor/document-editor/images/blazor-document-editor-image-resizing.jpeg
Normal file
После Ширина: | Высота: | Размер: 17 KiB |
После Ширина: | Высота: | Размер: 14 KiB |
После Ширина: | Высота: | Размер: 11 KiB |
После Ширина: | Высота: | Размер: 38 KiB |
После Ширина: | Высота: | Размер: 16 KiB |
После Ширина: | Высота: | Размер: 23 KiB |
|
@ -53,4 +53,4 @@ documentEditor.Editor.ClearList();
|
|||
|
||||
Document editor restarts the numbering or continue numbering for a numbered list. These options are found in the built-in context menu, if the list value is selected. Refer to the following screenshot.
|
||||
|
||||
![Image](images/list.jpeg)
|
||||
![Blazor DocumentEditor with List](images/blazor-document-editor-list.jpeg)
|
|
@ -37,8 +37,8 @@ The following code example shows how to restrict or protect editing for the enti
|
|||
|
||||
Also, at some situations, you might need to allow changes for a certain portion of the document alone. Microsoft Word allows you to [make changes to parts of a Word document](https://support.office.com/en-gb/article/allow-changes-to-parts-of-a-protected-document-187ed01c-8795-43e1-9fd0-c9fca419dadf). Likewise, the document editor control allows the users to make changes to certain parts of a document using similar user interface.
|
||||
|
||||
![Restrict Editing](./images/protection-enforced.png)
|
||||
![Disabling Restrict Editing in Blazor DocumentEditor](./images/blazor-document-editor-disable-edit-restriction.png)
|
||||
|
||||
![Restrict Editing Enabled](./images/protection-not-enforced.png)
|
||||
![Enabling Restrict Editing in Blazor DocumentEditor](./images/blazor-document-editor-enable-edit-restriction.png)
|
||||
|
||||
You can also explore our [Blazor Word Processor](https://blazor.syncfusion.com/demos/document-editor/default-functionalities) example to know how to render and configure the document editor.
|
||||
|
|
|
@ -63,7 +63,7 @@ documentEditor.Editor.InsertTableOfContents(tableOfContentsSettings);
|
|||
|
||||
You can update or edit the table of contents using the built-in context menu shown up by right-clicking it. Refer to the following screenshot.
|
||||
|
||||
![Table of Contents](images/table-of-contents.jpeg)
|
||||
![Updating Table Contents in Blazor DocumentEditor](images/blazor-documenteditor-table-contents.jpeg)
|
||||
|
||||
* **Update Field**: Updates the headings in table of contents with same settings by searching the entire document.
|
||||
* **Edit Field**: Opens the built-in table of contents dialog and allows you to modify its settings.
|
||||
|
|
|
@ -47,7 +47,7 @@ Initialize the Maps component with marker settings. Here, a marker is added with
|
|||
}
|
||||
```
|
||||
|
||||
![Markers with circle shape](../images/SingleMarker.PNG)
|
||||
![Blazor Maps Marker with Circle Shape](../images/blazor-maps-marker-with-circle.PNG)
|
||||
|
||||
<b>Step 2</b>
|
||||
|
||||
|
@ -94,7 +94,7 @@ Customize the above option for n number of markers as demonstrated in the follow
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with multiple marker](../images/MultipleMarker.PNG)
|
||||
![Blazor Maps with Multiple Marker](../images/blazor-maps-multiple-marker.PNG)
|
||||
|
||||
## Tooltip for marker
|
||||
|
||||
|
@ -132,4 +132,4 @@ Tooltip is used to display more information about marker on mouse over or touch-
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with marker Tooltip](../images/MarkerTooltip.png)
|
||||
![Blazor Maps with Marker Tooltip](../images/blazor-maps-marker-tooltip.png)
|
|
@ -24,4 +24,4 @@ Blazor Maps component provides support to change the center position of the Maps
|
|||
</SfMaps>
|
||||
```
|
||||
|
||||
![Maps with zoom Factor](../images/ZoomFactor.PNG)
|
||||
![Blazor Maps with Zooming Factor](../images/blazor-maps-zooming.PNG)
|
|
@ -35,7 +35,7 @@ To render Bing Maps in the Maps component, set the `UrlTemplate` property with
|
|||
|
||||
> In the above URL passed to the `GetBingUrlTemplate` method, specify the Bing Maps key.
|
||||
|
||||
![Bing Maps](../images/bingmap.PNG)
|
||||
![Blazor Bing Maps](../images/blazor-bing-map.PNG)
|
||||
|
||||
<b>Step 2</b>
|
||||
|
||||
|
@ -68,4 +68,4 @@ Add geometry shape in the Bing Maps using sublayer concept. To add geometry shap
|
|||
|
||||
The above code renders Africa continent as sublayer in the Bing Maps.
|
||||
|
||||
![Bing Map with Sublayer](../images/BingMapSublayer.PNG)
|
||||
![Blazor Bing Maps with Sublayer](../images/blazor-bing-map-sublayer.PNG)
|
После Ширина: | Высота: | Размер: 49 KiB |
После Ширина: | Высота: | Размер: 41 KiB |
После Ширина: | Высота: | Размер: 46 KiB |
После Ширина: | Высота: | Размер: 50 KiB |
После Ширина: | Высота: | Размер: 49 KiB |
После Ширина: | Высота: | Размер: 27 KiB |
После Ширина: | Высота: | Размер: 89 KiB |
После Ширина: | Высота: | Размер: 27 KiB |
После Ширина: | Высота: | Размер: 45 KiB |
Двоичные данные
blazor/maps/images/UserInteraction/blazor-maps-custom-tooltip-in-zoom-toolbar.png
Normal file
После Ширина: | Высота: | Размер: 26 KiB |
После Ширина: | Высота: | Размер: 40 KiB |
Двоичные данные
blazor/maps/images/UserInteraction/blazor-maps-custom-zoom-toolbar-buttons.png
Normal file
После Ширина: | Высота: | Размер: 24 KiB |
Двоичные данные
blazor/maps/images/UserInteraction/blazor-maps-custom-zooming-toolbar.png
Normal file
После Ширина: | Высота: | Размер: 24 KiB |
После Ширина: | Высота: | Размер: 27 KiB |
После Ширина: | Высота: | Размер: 45 KiB |
Двоичные данные
blazor/maps/images/UserInteraction/blazor-maps-shape-selection-using-legend.png
Normal file
После Ширина: | Высота: | Размер: 28 KiB |
После Ширина: | Высота: | Размер: 27 KiB |
После Ширина: | Высота: | Размер: 40 KiB |
После Ширина: | Высота: | Размер: 36 KiB |
После Ширина: | Высота: | Размер: 15 KiB |
После Ширина: | Высота: | Размер: 367 KiB |
После Ширина: | Высота: | Размер: 293 KiB |
После Ширина: | Высота: | Размер: 35 KiB |
После Ширина: | Высота: | Размер: 35 KiB |
После Ширина: | Высота: | Размер: 26 KiB |
|
@ -55,7 +55,7 @@ Maps component using [Format](https://help.syncfusion.com/cr/blazor/Syncfusion.B
|
|||
}
|
||||
```
|
||||
|
||||
![Maps Sample](./images/Internationalization/International.PNG)
|
||||
![Blazor Maps with Gloabalization](./images/Internationalization/blazor-maps-globalization.PNG)
|
||||
|
||||
## Numeric Format
|
||||
|
||||
|
@ -97,7 +97,7 @@ The numeric formats such as currency, percentage and so on can be displayed in t
|
|||
}
|
||||
```
|
||||
|
||||
![Maps Sample](./images/Internationalization/Internationalization.png)
|
||||
![Blazor Maps with Numeric Format](./images/Internationalization/blazor-maps-numeric-format.png)
|
||||
|
||||
## See also
|
||||
|
||||
|
|
|
@ -95,7 +95,7 @@ The following is the list of properties that is available in the **.resx** file
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with localization](./images/Localization/Localization.png)
|
||||
![Blazor Maps with Localization](./images/Localization/blazor-maps-localization.png)
|
||||
|
||||
## See also
|
||||
|
||||
|
|
|
@ -36,7 +36,7 @@ The rendered Maps can be printed directly from the browser by calling the [Print
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with print option](./images/Print/print.png)
|
||||
![Printing in Blazor Maps](./images/Print/blazor-maps-printing.png)
|
||||
|
||||
## Export
|
||||
|
||||
|
@ -68,7 +68,7 @@ To use the image export functionality, set the [AllowImageExport](https://help.s
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with export option](./images/Print/export.png)
|
||||
![Exporting in Blazor Maps](./images/Print/blazor-maps-exporting.png)
|
||||
|
||||
### PDF Export
|
||||
|
||||
|
@ -94,7 +94,7 @@ To use the PDF export functionality, set the [AllowPdfExport](https://help.syncf
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with export option](./images/Print/export.png)
|
||||
![Blazor Maps with PDF Export](./images/Print/blazor-maps-exporting.png)
|
||||
|
||||
### Exporting Maps as base64 string of the file
|
||||
|
||||
|
@ -153,4 +153,4 @@ The rendered Maps with providers such as OSM, Bing and other map providers can b
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with export option](./images/Print/osm-export.png)
|
||||
![Blazor Maps with OSM Export](./images/Print/blazor-maps-osm-export.png)
|
|
@ -29,7 +29,7 @@ Zooming of Maps is enabled by setting the [Enable](https://help.syncfusion.com/c
|
|||
</SfMaps>
|
||||
```
|
||||
|
||||
![Maps with zoom toolbar](./images/UserInteraction/Zoom.png)
|
||||
![Blazor Maps with Zooming](./images/UserInteraction/blazor-maps-zooming.png)
|
||||
|
||||
<b>Enable panning</b>
|
||||
|
||||
|
@ -105,7 +105,7 @@ The [MapsZoomToolbarSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.B
|
|||
</SfMaps>
|
||||
```
|
||||
|
||||
![Maps with custom zoom toolbar](./images/UserInteraction/custom-toolbar.png)
|
||||
![Blazor Maps with Custom Zooming Toolbar](./images/UserInteraction/blazor-maps-custom-zooming-toolbar.png)
|
||||
|
||||
The [MapsZoomToolbarButton](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomToolbarButton.html) class can be used to customize the buttons in the zooming toolbar. The `MapsZoomToolbarButton` class has the following properties.
|
||||
|
||||
|
@ -139,7 +139,7 @@ The [MapsZoomToolbarButton](https://help.syncfusion.com/cr/blazor/Syncfusion.Bla
|
|||
</SfMaps>
|
||||
```
|
||||
|
||||
![Maps with custom zoom toolbar buttons](./images/UserInteraction/custom-toolbar-buttons.png)
|
||||
![Blazor Maps with Custom Zoom Toolbar Buttons](./images/UserInteraction/blazor-maps-custom-zoom-toolbar-buttons.png)
|
||||
|
||||
The [MapsZoomToolbarTooltipSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Maps.MapsZoomToolbarTooltipSettings.html) class can be used to customize the tooltip in the zooming toolbar. The `MapsZoomToolbarTooltipSettings` class has the following properties.
|
||||
|
||||
|
@ -174,7 +174,7 @@ The [MapsZoomToolbarTooltipSettings](https://help.syncfusion.com/cr/blazor/Syncf
|
|||
</SfMaps>
|
||||
```
|
||||
|
||||
![Maps with custom tooltip in zoom toolbar](./images/UserInteraction/custom-tooltip.png)
|
||||
![Blazor Maps with Custom Tooltip in Zoom Toolbar](./images/UserInteraction/blazor-maps-custom-tooltip-in-zoom-toolbar.png)
|
||||
|
||||
#### Pinch zooming
|
||||
|
||||
|
@ -315,7 +315,7 @@ The following properties and class are available to customize the selection of M
|
|||
</SfMaps>
|
||||
```
|
||||
|
||||
![Maps with shape selection](./images/UserInteraction/Selection.png)
|
||||
![Blazor Maps with Shape Selection](./images/UserInteraction/blazor-maps-shape-selection.png)
|
||||
|
||||
By tapping on the specific legend, the shapes which are bounded to the selected legend is also selected and vice versa.
|
||||
|
||||
|
@ -357,7 +357,7 @@ By tapping on the specific legend, the shapes which are bounded to the selected
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with shape selection using legend](./images/UserInteraction/highlight-with-legend.png)
|
||||
![Blazor Maps with Shape Selection using Legend](./images/UserInteraction/blazor-maps-shape-selection-using-legend.png)
|
||||
|
||||
### Enable selection for bubbles
|
||||
|
||||
|
@ -405,7 +405,7 @@ To enable the selection for bubbles in Maps, set the [MapsBubbleSelectionSetting
|
|||
}
|
||||
```
|
||||
|
||||
![Enable selection for bubble](./images/UserInteraction/selection-bubble.PNG)
|
||||
![Enabling Bubble Selection in Blazor Maps](./images/UserInteraction/blazor-maps-bubble-selection.PNG)
|
||||
|
||||
### Enable selection for markers
|
||||
|
||||
|
@ -450,7 +450,7 @@ To enable the selection for markers in Maps, set the [MapsMarkerSelectionSetting
|
|||
}
|
||||
```
|
||||
|
||||
![Enable selection for marker](./images/UserInteraction/selection-marker.PNG)
|
||||
![Enabling Marker Selection in Blazor Maps](./images/UserInteraction/blazor-maps-marker-selection.PNG)
|
||||
|
||||
### Public method for the shape selection
|
||||
|
||||
|
@ -482,7 +482,7 @@ The [ShapeSelection](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Map
|
|||
}
|
||||
```
|
||||
|
||||
![Markers with cluster](./images/Marker/public-method.PNG)
|
||||
![Blazor Maps Marker with Cluster](./images/Marker/blazor-maps-marker-cluster.PNG)
|
||||
|
||||
### Initial shape selection
|
||||
|
||||
|
@ -504,7 +504,7 @@ The shape is initially selected using the [MapsInitialShapeSelection](https://he
|
|||
</SfMaps>
|
||||
```
|
||||
|
||||
![initial with selection](./images/Marker/initial-selection.PNG)
|
||||
![Blazor Maps with Initial Shape Selection](./images/Marker/blazor-maps-initial-shape-selection.PNG)
|
||||
|
||||
### Initial marker selection
|
||||
|
||||
|
@ -544,7 +544,7 @@ Using the [InitialMarkerSelection](https://help.syncfusion.com/cr/blazor/Syncfus
|
|||
}
|
||||
```
|
||||
|
||||
![Enable initial marker selection](./images/UserInteraction/selection-marker.PNG)
|
||||
![Blazor Maps with Initial Marker Selection](./images/UserInteraction/blazor-maps-marker-selection.PNG)
|
||||
|
||||
## Highlight
|
||||
|
||||
|
@ -572,7 +572,7 @@ The following properties and classes are available to customize the highlight of
|
|||
</SfMaps>
|
||||
```
|
||||
|
||||
![Maps with highlighting shape](./images/UserInteraction/Highlight.png)
|
||||
![Highlighting Blazor Maps Shape](./images/UserInteraction/blazor-maps-highlight-shape.png)
|
||||
|
||||
Hovering on the specific legend, the shapes which are bounded to the selected legend is also highlighted and vice versa.
|
||||
|
||||
|
@ -614,7 +614,7 @@ Hovering on the specific legend, the shapes which are bounded to the selected le
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with highlighting shape using legend](./images/UserInteraction/highlight-with-legend.png)
|
||||
![Highlighting Blazor Maps Shape with Legend](./images/UserInteraction/blazor-maps-shape-selection-using-legend.png)
|
||||
|
||||
### Enable highlight for bubbles
|
||||
|
||||
|
@ -664,7 +664,7 @@ To enable the highlight for bubbles in Maps, set the [MapsBubbleHighlightSetting
|
|||
}
|
||||
```
|
||||
|
||||
![Enable highlight for bubbles](./images/UserInteraction/selection-bubble.PNG)
|
||||
![Enabling Bubble Selection in Blazor Maps](./images/UserInteraction/blazor-maps-bubble-selection.PNG)
|
||||
|
||||
### Enable highlight for markers
|
||||
|
||||
|
@ -701,7 +701,7 @@ To enable the highlight for markers in Maps, set the [MapsMarkerHighlightSetting
|
|||
}
|
||||
```
|
||||
|
||||
![Enable highlight for markers](./images/UserInteraction/selection-marker.PNG)
|
||||
![Highlighting Marker Selection in Blazor Maps](./images/UserInteraction/blazor-maps-marker-selection.PNG)
|
||||
|
||||
## Tooltip
|
||||
|
||||
|
@ -724,7 +724,7 @@ On mouse over or touch end event, the tooltip is used to get more information ab
|
|||
</SfMaps>
|
||||
```
|
||||
|
||||
![Maps with tooltip](./images/UserInteraction/tooltip.PNG)
|
||||
![Blazor Maps with Tooltip](./images/UserInteraction/blazor-maps-tooltip.PNG)
|
||||
|
||||
### Customization
|
||||
|
||||
|
@ -782,7 +782,7 @@ The following properties are available to customize the tooltip of the Maps comp
|
|||
}
|
||||
```
|
||||
|
||||
![Maps with tooltip](./images/UserInteraction/tooltip-customization.png)
|
||||
![Blazor Maps with Custom Tooltip](./images/UserInteraction/blazor-maps-custom-tooltip.png)
|
||||
|
||||
### Tooltip template
|
||||
|
||||
|
@ -886,7 +886,7 @@ The HTML element can be rendered in the tooltip of the Maps using the [TooltipTe
|
|||
</style>
|
||||
```
|
||||
|
||||
![Maps with tooltip template](./images/UserInteraction/tooltip-template.PNG)
|
||||
![Blazor Maps with Tooltip Template](./images/UserInteraction/blazor-maps-tooltip-template.PNG)
|
||||
|
||||
## See also
|
||||
|
||||
|
|
|
@ -18,7 +18,7 @@ The PDF Viewer control provides options to add, edit, and delete the comments to
|
|||
* Text markup annotation
|
||||
* Free text annotation
|
||||
|
||||
![Comments](../../pdfviewer/images/commentannot.png)
|
||||
![Comments in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-comments.png)
|
||||
|
||||
## Adding a comment to the annotation
|
||||
|
||||
|
@ -50,7 +50,7 @@ If the comment panel is already in open state, you can select the annotations an
|
|||
* Selected annotation comment container is highlighted in the comment panel.
|
||||
* Now, you can add comment and comment replies using comment panel.
|
||||
|
||||
![AddingComments](../../pdfviewer/images/stickycomment.png)
|
||||
![Adding Comments in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-add-new-comment.png)
|
||||
|
||||
### Adding Comment Replies
|
||||
|
||||
|
@ -64,7 +64,7 @@ If the comment panel is already in open state, you can select the annotations an
|
|||
* Select Set Status option in the context menu that appears.
|
||||
* Select the status of the annotation comment in the context menu that appears.
|
||||
|
||||
![CommentStatus](../../pdfviewer/images/commentstatus.png)
|
||||
![Blazor PDFViewer with Comment Status](../../pdfviewer/images/blazor-pdfviewer-comment-status.png)
|
||||
|
||||
### Editing the comments and comments replies of the annotations
|
||||
|
||||
|
@ -95,7 +95,7 @@ The annotation comment and comment replies can be edited by the following ways:
|
|||
* Select the status of the annotation comment in the context menu that appears.
|
||||
* Status ‘None’ is the default state. If status set to ‘None’, the comments or reply does not appear.
|
||||
|
||||
![CommentEdit](../../pdfviewer/images/commentsedit.png)
|
||||
![Editing Comment in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-comment-editing.png)
|
||||
|
||||
### Delete Comment or Comment Replies
|
||||
|
||||
|
@ -103,7 +103,7 @@ The annotation comment and comment replies can be edited by the following ways:
|
|||
* Click the more options button shown in Comments or reply container.
|
||||
* Select Delete option in the context menu that appears.
|
||||
|
||||
![CommentEdit](../../pdfviewer/images/commentsdelete.png)
|
||||
![Deleting Comment in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-delete-comments.png)
|
||||
|
||||
> The annotation will be deleted on deleting the comment using comment panel.
|
||||
|
||||
|
|
|
@ -21,7 +21,7 @@ The Free text annotations can be added to the PDF document using the annotation
|
|||
|
||||
In the pan mode, if the free text annotation mode is entered, the PDF Viewer control will switch to text select mode.
|
||||
|
||||
![FreeTextAnnotation](../../pdfviewer/images/freetext_tool.png)
|
||||
![Free Text Annotation in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-free-text-annotation.png)
|
||||
|
||||
Refer to the following code snippet to switch to Free Text annotation mode.
|
||||
|
||||
|
@ -53,55 +53,55 @@ The font family, font size, font styles, font color, text alignment, fill color,
|
|||
|
||||
The font family of the annotation can be edited by selecting the desired font in the Font Family tool.
|
||||
|
||||
![FontFamily](../../pdfviewer/images/fontfamily.png)
|
||||
![Editing Font Family of Blazor PDFViewer Text](../../pdfviewer/images/blazor-pdfviewer-edit-font-family.png)
|
||||
|
||||
### Editing font size
|
||||
|
||||
The font size of the annotation can be edited by selecting the desired size in the Font Size tool.
|
||||
|
||||
![FontSize](../../pdfviewer/images/fontsize.png)
|
||||
![Editing Font Size of Blazor PDFViewer Text](../../pdfviewer/images/blazor-pdfviewer-edit-font-size.png)
|
||||
|
||||
### Editing font color
|
||||
|
||||
The font color of the annotation can be edited using the color palette provided in the Font Color tool.
|
||||
|
||||
![FontColor](../../pdfviewer/images/fontcolor.png)
|
||||
![Editing Font Color of Blazor PDFViewer Text](../../pdfviewer/images/fontcolor.png)
|
||||
|
||||
### Editing the text alignment
|
||||
|
||||
The text in the annotation can be aligned by selecting the desired styles in the dropdown pop-up in the Text Align tool.
|
||||
|
||||
![FreeTextAnnotation](../../pdfviewer/images/textalign.png)
|
||||
![Editing Free Text Annotation in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-text-alignment.png)
|
||||
|
||||
### Editing text styles
|
||||
|
||||
The style of the text in the annotation can be by edited by selecting the desired styles in the dropdown pop-up in the Font Style tool.
|
||||
|
||||
![FontStyle](../../pdfviewer/images/fontstyle.png)
|
||||
![Editing Font Style in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-edit-font-style.png)
|
||||
|
||||
### Editing fill color
|
||||
|
||||
The fill color of the annotation can be edited using the color palette provided in the Edit Color tool.
|
||||
|
||||
![FillColor](../../pdfviewer/images/fillcolor.png)
|
||||
![Editing Fill Color in Blazor PDFViewer Text](../../pdfviewer/images/blazor-pdfviewer-text-fill-color.png)
|
||||
|
||||
### Editing stroke color
|
||||
|
||||
The stroke color of the annotation can be edited using the color palette provided in the Edit Stroke Color tool.
|
||||
|
||||
![StrokeColor](../../pdfviewer/images/fontstroke.png)
|
||||
![Editing Stroke Color of Blazor PDFViewer Text](../../pdfviewer/images/blazor-pdfviewer-font-stroke.png)
|
||||
|
||||
### Editing thickness
|
||||
|
||||
The thickness of the border of the annotation can be edited using the range slider provided in the Edit Thickness tool.
|
||||
|
||||
![FontThickness](../../pdfviewer/images/fontthickness.png)
|
||||
![Editing Font Border Thickness of Blazor PDFViewer Text](../../pdfviewer/images/blazor-pdfviewer-font-border-thickness.png)
|
||||
|
||||
### Editing opacity
|
||||
|
||||
The opacity of the annotation can be edited using the range slider provided in the Edit Opacity tool.
|
||||
|
||||
![FontOpacity](../../pdfviewer/images/fontopacity.png)
|
||||
![Editing Font Opacity in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-font-opacity.png)
|
||||
|
||||
## Setting default properties during control initialization
|
||||
|
||||
|
|
|
@ -17,7 +17,7 @@ The PDF Viewer provides the options to add measurement annotations. You can meas
|
|||
* Radius
|
||||
* Volume
|
||||
|
||||
![CalibrateAnnotation](../../pdfviewer/images/calibrate_annotatio.png)
|
||||
![Calibrate Annotation in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-calibrate-annotation.png)
|
||||
|
||||
## Adding measurement annotations to the PDF document
|
||||
|
||||
|
@ -30,7 +30,7 @@ The measurement annotations can be added to the PDF document using the annotatio
|
|||
|
||||
In the pan mode, if the measurement annotation mode is entered, the PDF Viewer control will switch to text select mode.
|
||||
|
||||
![CalibrateTool](../../pdfviewer/images/calibrate_tool.png)
|
||||
![Adding Calibrate in Blazor PDFViewer Toolbar](../../pdfviewer/images/blazor-pdfviewer-add-calibrate-in-toolbar.png)
|
||||
|
||||
Refer to the following code snippet to switch to distance annotation mode.
|
||||
|
||||
|
@ -62,31 +62,31 @@ The fill color, stroke color, thickness, and opacity of the measurement annotati
|
|||
|
||||
The fill color of the annotation can be edited using the color palette provided in the Edit Color tool.
|
||||
|
||||
![CalibrateFillColor](../../pdfviewer/images/calibrate_fillcolor.png)
|
||||
![Editing Calibrate FillColor in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-calibrate-fillcolor.png)
|
||||
|
||||
### Editing stroke color
|
||||
|
||||
The stroke color of the annotation can be edited using the color palette provided in the Edit Stroke Color tool.
|
||||
|
||||
![CalibrateStrokeColor](../../pdfviewer/images/calibrate_stroke.png)
|
||||
![Editing Calibrate StrokeColor in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-calibrate-stroke-color.png)
|
||||
|
||||
### Editing thickness
|
||||
|
||||
The thickness of the border of the annotation can be edited using the range slider provided in the Edit thickness tool.
|
||||
|
||||
![CalibrateThickness](../../pdfviewer/images/calibrate_thickness.png)
|
||||
![Editing Calibrate Thickness in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-calibrate-thickness.png)
|
||||
|
||||
### Editing opacity
|
||||
|
||||
The opacity of the annotation can be edited using the range slider provided in the Edit Opacity tool.
|
||||
|
||||
![CalibrateOpacity](../../pdfviewer/images/calibarte_opacity.png)
|
||||
![Editing Calibrate Opacity in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-calibrate-opacity.png)
|
||||
|
||||
### Editing the line properties
|
||||
|
||||
The properties of the line shapes such as distance and perimeter annotations can be edited using the Line properties window. It can be opened by selecting the Properties option in the context menu that appears on right-clicking the distance and perimeter annotations.
|
||||
|
||||
![CalibrateProperty](../../pdfviewer/images/calibrate_lineprop.png)
|
||||
![Editing Calibrate Property in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-calibrate-property.png)
|
||||
|
||||
## Setting default properties during control initialization
|
||||
|
||||
|
@ -113,7 +113,7 @@ Refer to the following code snippet to set the default annotation settings.
|
|||
|
||||
The scale ratio and unit of measurement can be modified using the scale ratio option provided in the context menu of the PDF Viewer control.
|
||||
|
||||
![CalibrateScaleRatio](../../pdfviewer/images/calibrate_scaleratio.png)
|
||||
![Editing Calibrate Scale Ratio in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-calibrate-scaleratio.png)
|
||||
|
||||
The Units of measurements support for the measurement annotations in the PDF Viewer are
|
||||
|
||||
|
@ -124,7 +124,7 @@ The Units of measurements support for the measurement annotations in the PDF Vie
|
|||
* Pica
|
||||
* Feet
|
||||
|
||||
![CalibrateScaleDialog](../../pdfviewer/images/calibrate_scaledialog.png)
|
||||
![Calibrate Scale Dialog in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-calibrate-scale-dialog.png)
|
||||
|
||||
## Setting default scale ratio settings during control initialization
|
||||
|
||||
|
|
|
@ -17,7 +17,7 @@ The PDF Viewer control provides the options to add, edit and delete the shape an
|
|||
* Circle
|
||||
* Polygon
|
||||
|
||||
![ShapeAnnotation](../../pdfviewer/images/shape_annot.png)
|
||||
![Shape Annotation in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-shape-annotation.png)
|
||||
|
||||
## Adding a shape annotation to the PDF document
|
||||
|
||||
|
@ -30,7 +30,7 @@ Shape annotations can be added to the PDF document using the annotation toolbar.
|
|||
|
||||
In the pan mode, if the shape annotation mode is entered, the PDF Viewer control will switch to text select mode.
|
||||
|
||||
![ShapeTool](../../pdfviewer/images/shape_toolbar.png)
|
||||
![Adding Shapes in Blazor PDFViewer Toolbar](../../pdfviewer/images/blazor-pdfviewer-add-shape-in-toolbar.png)
|
||||
|
||||
Refer to the following code snippet to switch to circle annotation mode.
|
||||
|
||||
|
@ -62,25 +62,25 @@ The fill color, stroke color, thickness and opacity of the shape annotation can
|
|||
|
||||
The fill color of the annotation can be edited using the color palette provided in the Edit Color tool.
|
||||
|
||||
![ShapeFillColor](../../pdfviewer/images/shape_fillColor.png)
|
||||
![Editing Fill Color in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-edit-fill-color.png)
|
||||
|
||||
### Editing stroke color
|
||||
|
||||
The stroke color of the annotation can be edited using the color palette provided in the Edit Stroke Color tool.
|
||||
|
||||
![ShapeStrokeColor](../../pdfviewer/images/shape_strokecolor.png)
|
||||
![Editing Shape Stroke Color in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-edit-shape-stroke-color.png)
|
||||
|
||||
### Editing thickness
|
||||
|
||||
The thickness of the border of the annotation can be edited using the range slider provided in the Edit Thickness tool.
|
||||
|
||||
![ShapeThickness](../../pdfviewer/images/shape_thickness.png)
|
||||
![Editing Shape Thickness in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-shape-thickness.png)
|
||||
|
||||
### Editing opacity
|
||||
|
||||
The opacity of the annotation can be edited using the range slider provided in the Edit Opacity tool.
|
||||
|
||||
![ShapeOpacity](../../pdfviewer/images/shape_opacity.png)
|
||||
![Editing Shape Opacity in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-shape-opacity.png)
|
||||
|
||||
### Editing the line properties
|
||||
|
||||
|
@ -88,7 +88,7 @@ The properties of the line shapes such as line and arrow annotations can be edit
|
|||
|
||||
Refer to the following code snippet to set the default annotation settings.
|
||||
|
||||
![ShapeProperty](../../pdfviewer/images/shape_lineprty.png)
|
||||
![Editing Line Property in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-edit-line-property.png)
|
||||
|
||||
## Setting default properties during control initialization
|
||||
|
||||
|
|
|
@ -16,7 +16,7 @@ The PDF Viewer control provides options to add, edit, delete and rotate the foll
|
|||
* Standard Business
|
||||
* Custom Stamp
|
||||
|
||||
![StampAnnotation](../../pdfviewer/images/stamp_annot.png)
|
||||
![Stamp Annotation in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-stamp-annotation.png)
|
||||
|
||||
## Adding stamp annotations to the PDF document
|
||||
|
||||
|
@ -25,11 +25,11 @@ The stamp annotations can be added to the PDF document using the annotation tool
|
|||
* Click the **Edit Annotation** button in the PDF Viewer toolbar. A toolbar appears below it.
|
||||
* Click the **Stamp Annotation** dropdown button. A dropdown pop-up will appear and shows the stamp annotations to be added.
|
||||
|
||||
![StampTool](../../pdfviewer/images/stamp_tool.png)
|
||||
![Adding Stamp in Blazor PDFViewer Toolbar](../../pdfviewer/images/blazor-pdfviewer-add-stamp-in-toolbar.png)
|
||||
|
||||
* Select the annotation type to be added to the page in the pop-up.
|
||||
|
||||
![StampPopup](../../pdfviewer/images/selectstamp_annot.png)
|
||||
![Selecting Annotation from Stamp Popup in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-select-stamp-annotation.png)
|
||||
|
||||
* You can add the annotation over the pages of the PDF document.
|
||||
|
||||
|
@ -41,7 +41,7 @@ In the pan mode, if the stamp annotation mode is entered, the PDF Viewer control
|
|||
* Click the **Stamp Annotation** dropdown button. A dropdown pop-up will appear and shows the stamp annotations to be added.
|
||||
* Click the Custom Stamp button.
|
||||
|
||||
![CustomStamp](../../pdfviewer/images/customstamp.png)
|
||||
![Custom Stamp in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-custom-stamp.png)
|
||||
|
||||
* The file explorer dialog will appear, choose the image and then add the image in the PDF page.
|
||||
|
||||
|
|
|
@ -11,7 +11,7 @@ documentation: ug
|
|||
|
||||
The PDF Viewer control provides the options to add, edit, and delete the sticky note annotations in the PDF document.
|
||||
|
||||
![StickyNotesAnnotation](../../pdfviewer/images/stickynotes_annotation.png)
|
||||
![StickyNotes Annotation in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-stickynotes-annotation.png)
|
||||
|
||||
## Adding a sticky note annotation to the PDF document
|
||||
|
||||
|
@ -21,7 +21,7 @@ Sticky note annotations can be added to the PDF document using the annotation to
|
|||
* Click the position, where you want to add sticky note annotation in the PDF document.
|
||||
* Sticky note annotation will be added in the clicked positions.
|
||||
|
||||
![StickyNotesTool](../../pdfviewer/images/stickynotes_tool.png)
|
||||
![Adding StickyNotes in Blazor PDFViewer Toolbar](../../pdfviewer/images/blazor-pdfviewer-add-stickynotes-in-toolbar.png)
|
||||
|
||||
Annotation comments can be added to the PDF document using the comment panel.
|
||||
|
||||
|
@ -30,7 +30,7 @@ Annotation comments can be added to the PDF document using the comment panel.
|
|||
* Now, you can add Comments, Reply, and Status using Comment Panel.
|
||||
* Now, you can add Comments, Reply, and Status using Comment Panel
|
||||
|
||||
![StickyNotesComment](../../pdfviewer/images/stickynotes_comment.png)
|
||||
![Blazor PDFViewer with StickyNotes Comment](../../pdfviewer/images/blazor-pdfviewer-stickynotes-comment.png)
|
||||
|
||||
## Editing the properties of the sticky note annotation
|
||||
|
||||
|
@ -38,7 +38,7 @@ Annotation comments can be added to the PDF document using the comment panel.
|
|||
|
||||
The opacity of the annotation can be edited using the range slider provided in the Edit Opacity tool.
|
||||
|
||||
![StickyNotesOpacity](../../pdfviewer/images/sticky_opacity.png)
|
||||
![StickyNotes Opacity in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-stickynotes-opacity.png)
|
||||
|
||||
### Editing comments
|
||||
|
||||
|
@ -46,11 +46,11 @@ The comment, comment reply, and comment status of the annotation can be edited u
|
|||
|
||||
* Open the comment panel using the Comment Panel button showing in the annotation toolbar.
|
||||
|
||||
![StickyNotesComment](../../pdfviewer/images/commentPanel.png)
|
||||
![Editing StickyNotes Comment in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-edit-sticknotes-comment.png)
|
||||
|
||||
You can modify or delete the comments or comments replay and it’s status using the menu option provided in the comment panel.
|
||||
|
||||
![StickyNotesEdit](../../pdfviewer/images/sticky_editbtn.png)
|
||||
![StickyNotes Editing in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-editing-stickynotes.png)
|
||||
|
||||
## Setting default properties during control initialization
|
||||
|
||||
|
|
|
@ -11,7 +11,7 @@ documentation: ug
|
|||
|
||||
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.
|
||||
|
||||
![TextMarkupAnnotation](../../pdfviewer/images/text_markup_annotation.png)
|
||||
![Blazor PDFViewer with Text Markup Annotation](../../pdfviewer/images/blazor-pdfviewer-text-markup-annotation.png)
|
||||
|
||||
## Adding text markup annotation to the PDF Document
|
||||
|
||||
|
@ -25,7 +25,7 @@ There are two ways to highlight a text in the PDF document.
|
|||
|
||||
* Select a text in the PDF document and right-click it
|
||||
* Select **Highlight** option in the context menu that appears
|
||||
![HighlightContext](../../pdfviewer/images/highlight_context.png)
|
||||
![Highlighting Context in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-highlight-context.png)
|
||||
|
||||
**Using the annotation toolbar.**
|
||||
|
||||
|
@ -34,7 +34,7 @@ There are two ways to highlight a text in the PDF document.
|
|||
* Select the text and the highlight annotation will be added.
|
||||
* You can also select the text and apply the highlight annotation using the **Highlight** button
|
||||
|
||||
![HighlightText](../../pdfviewer/images/highlight_text.png)
|
||||
![Highlighting Text in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-highlight-text.png)
|
||||
|
||||
In the pan mode, if the highlight mode is entered, the PDF Viewer control will switch to text select mode to enable the text selection for highlighting the text.
|
||||
|
||||
|
@ -69,7 +69,7 @@ There are two ways to underline a text in the PDF document:
|
|||
* Select a text in the PDF document and right-click it
|
||||
* Select **Underline** option in the context menu that appears.
|
||||
|
||||
![UnderlineContext](../../pdfviewer/images/underline_context.png)
|
||||
![Displaying Underline in Blazor PDFViewer ContextMenu](../../pdfviewer/images/blazor-pdfviewer-underline-context-menu.png)
|
||||
|
||||
**Using the annotation toolbar.**
|
||||
|
||||
|
@ -78,7 +78,7 @@ There are two ways to underline a text in the PDF document:
|
|||
* Select the text and the underline annotation will be added.
|
||||
* You can also select the text and apply the underline annotation using the **Underline** button
|
||||
|
||||
![UnderlineText](../../pdfviewer/images/underline_text.png)
|
||||
![Blazor PDFViewer with Underline Text](../../pdfviewer/images/blazor-pdfviewer-underline-text.png)
|
||||
|
||||
In the pan mode, if the underline mode is entered, the PDF Viewer control will switch to text select mode to enable the text selection for underlining the text.
|
||||
|
||||
|
@ -113,7 +113,7 @@ Using the context menu.
|
|||
* Select a text in the PDF document and right-click it
|
||||
* Select **strikethrough** option in the context menu that appears.
|
||||
|
||||
![StrikeThrough](../../pdfviewer/images/strikethrough_context.png)
|
||||
![Displaying Strike Through in Blazor PDFViewer ContextMenu](../../pdfviewer/images/blazor-pdfviewer-strike-through-in-contextmenu.png)
|
||||
|
||||
**Using the annotation toolbar.**
|
||||
|
||||
|
@ -122,7 +122,7 @@ Using the context menu.
|
|||
* Select the text and the strikethrough annotation will be added.
|
||||
* You can also select the text and apply the strikethrough annotation using the **Strikethrough** button
|
||||
|
||||
![StrikeThroughText](../../pdfviewer/images/strike_through.png)
|
||||
![Blazor PDFViewer with StrikeThrough Text](../../pdfviewer/images/blazor-pdfviewer-strike-through-text.png)
|
||||
|
||||
In the pan mode, if the strikethrough mode is entered, the PDF Viewer control will switch to text select mode to enable the text selection to strike through the text.
|
||||
|
||||
|
@ -156,13 +156,13 @@ The color and the opacity of the text markup annotation can be edited using the
|
|||
|
||||
The color of the annotation can be edited using the color palette provided in the Edit Color tool.
|
||||
|
||||
![TextMarkupEditColor](../../pdfviewer/images/textmarkup_editcolor.png)
|
||||
![Editing Text Color in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-editing-text-color.png)
|
||||
|
||||
### Editing opacity
|
||||
|
||||
The opacity of the annotation can be edited using the range slider provided in the Edit Opacity tool.
|
||||
|
||||
![TextMarkupEditOpacity](../../pdfviewer/images/textmarup_editopacity.png)
|
||||
![Editing Text Opacity in Blazor PDFViewer](../../pdfviewer/images/blazor-pdfviewer-edit-text-opacity.png)
|
||||
|
||||
## Text markup annotation settings
|
||||
|
||||
|
|
|
@ -17,19 +17,19 @@ This section briefly explains how to include a PDF Viewer in your Blazor server
|
|||
|
||||
**Step 1:** Choose **Create a new project** from the Visual Studio dashboard.Click Next.
|
||||
|
||||
![new project](../images/new-project.png)
|
||||
![Creating New Project in Blazor](../images/blazor-create-new-project.png)
|
||||
|
||||
**Step 2:** Select **Blazor Server App** from the template, and then click **Next** button..
|
||||
|
||||
![blazor template](../images/blazor-template-serve.png)
|
||||
![Blazor Application Template](../images/blazor-application-template.png)
|
||||
|
||||
**Step 3:** Now, the project configuration window will popup. Click **Next** button to modify the additional information.
|
||||
|
||||
![project-configuration](../images/project-configurations-server.png)
|
||||
![Blazor Project Configuration](../images/blazor-project-configurations.png)
|
||||
|
||||
**Step 4:** Select the target Framework **.NET 5.0** at the top of the Application based on your required target and then click **Create** button to create a new Blazor Server application.
|
||||
|
||||
![Add info](../images/addition-information-server.png)
|
||||
![Blazor Server Application with Additional Information](../images/blazor-server-app-with-addition-information.png)
|
||||
|
||||
**Step 5:** Installing Syncfusion Blazor packages in the application
|
||||
|
||||
|
@ -43,11 +43,11 @@ You can use any one of the below standard to install the Syncfusion Blazor libra
|
|||
|
||||
2. Right-click the project,and then select `Manage NuGet Packages`.
|
||||
|
||||
![nuget explorer](../images/nuget-explorer.png)
|
||||
![Blazor NuGet Explorer](../images/blazor-nuget-explorer.png)
|
||||
|
||||
3. Search **Syncfusion.Blazor.PdfViewerServer.Windows** keyword in the Browse tab and install **Syncfusion.Blazor.PdfViewerServer.Windows** NuGet package in the application.
|
||||
|
||||
![select nuget](../images/individual-nuget-server.png)
|
||||
![Searching Blazor PDFViewer NuGet Package](../images/blazor-pdfviewer-nuget-package.png)
|
||||
|
||||
4. The `Syncfusion.Blazor.PdfViewerServer.Windows` package will be included in the newly created project once the installation process is completed.
|
||||
|
||||
|
@ -61,11 +61,11 @@ W>If you prefer the above new standard (individual NuGet packages), then skip th
|
|||
|
||||
1. Now, install **Syncfusion.Blazor** NuGet package to the newly created application by using the `NuGet Package Manager`. Right-click the project and then select Manage NuGet Packages.
|
||||
|
||||
![nuget explorer](../images/nuget-explorer.png)
|
||||
![Blazor NuGet Explorer](../images/blazor-nuget-explorer.png)
|
||||
|
||||
2. Search **Syncfusion.Blazor** keyword in the Browse tab and install **Syncfusion.Blazor** NuGet package in the application.
|
||||
|
||||
![select nuget](../images/select-nugets.png)
|
||||
![Searching Blazor NuGet Package](../images/blazor-nuget-package.png)
|
||||
|
||||
3. The `Syncfusion Blazor` package will be installed in the project once the installation process is completed.
|
||||
|
||||
|
@ -135,7 +135,7 @@ private string DocumentPath { get; set; } = "wwwroot/Data/PDF_Succinctly.pdf";
|
|||
|
||||
**Step 10:** Run the application, the PDF Viewer component will be rendered in the web browser as shown in the following screenshot.
|
||||
|
||||
![output image](../images/browser-output.png)
|
||||
![Blazor PDFViewer](../images/blazor-pdfviewer.png)
|
||||
|
||||
Download the Server side application from [here](https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorServer1089926850.zip)
|
||||
|
||||
|
|
|
@ -15,19 +15,19 @@ documentation: ug
|
|||
|
||||
**Step 1:** Choose **Create a new project** from the Visual Studio dashboard.Click Next.
|
||||
|
||||
![new project](../images/new-project.png)
|
||||
![Creating New Project in Blazor](../images/blazor-create-new-project.png)
|
||||
|
||||
**Step 2:** Select **Blazor WebAssembly App** from the template, and then click **Next** button..
|
||||
|
||||
![blazor template](../images/blazor-template.png)
|
||||
![Blazor Application Template](../images/blazor-template.png)
|
||||
|
||||
**Step 3:** Now, the project configuration window will popup. Click **Next** button to modify the additional information.
|
||||
|
||||
![project-configuration](../images/project-configurations.png)
|
||||
![Blazor Project Configuration](../images/blazor-project-configuration.png)
|
||||
|
||||
**Step 4:** Select the target Framework **.NET 5.0** at the top of the Application based on your required target and then click **Create** button to create a new Blazor WebAssembly application.
|
||||
|
||||
![Add info](../images/addition-information.png)
|
||||
![Blazor Server Application with Additional Information](../images/blazor-webassembly-app-with-addition-information.png)
|
||||
|
||||
**Step 5:** Installing Syncfusion Blazor packages in the application
|
||||
|
||||
|
@ -41,11 +41,11 @@ You can use any one of the below standard to install the Syncfusion Blazor libra
|
|||
|
||||
2. Right-click the project,and then select `Manage NuGet Packages`.
|
||||
|
||||
![nuget explorer](../images/nuget-explorer.png)
|
||||
![Blazor NuGet Explorer](../images/blazor-nuget-explorer.png)
|
||||
|
||||
3. Search **Syncfusion.Blazor.PdfViewer** keyword in the Browse tab and install **Syncfusion.Blazor.PdfViewer** NuGet package in the application.
|
||||
|
||||
![select nuget](../images/individual-nuget.png)
|
||||
![Searching Blazor PDFViewer NuGet Package](../images/blazor-pdfviewer-search-nuget-package.png)
|
||||
|
||||
4. The Syncfusion Blazor PdfViewer package will be included in the newly created project once the installation process is completed.
|
||||
|
||||
|
@ -55,11 +55,11 @@ W> If you prefer the above new standard (individual NuGet packages), then skip t
|
|||
|
||||
1. Now, install **Syncfusion.Blazor** NuGet package to the newly created application by using the `NuGet Package Manager`. Right-click the project and then select Manage NuGet Packages.
|
||||
|
||||
![nuget explorer](../images/nuget-explorer.png)
|
||||
![Blazor NuGet Explorer](../images/blazor-nuget-explorer.png)
|
||||
|
||||
2. Search **Syncfusion.Blazor** keyword in the Browse tab and install **Syncfusion.Blazor** NuGet package in the application.
|
||||
|
||||
![select nuget](../images/select-nugets.png)
|
||||
![Searching Blazor NuGet Package](../images/blazor-nuget-package.png)
|
||||
|
||||
3. The Syncfusion Blazor package will be installed in the project once the installation process is completed.
|
||||
|
||||
|
@ -125,7 +125,7 @@ We can disable the dynamic script loading and refer to the scripts from the appl
|
|||
|
||||
**Step 10:** Run the application, the PDF Viewer component will be rendered in the web browser as shown in the following screenshot.
|
||||
|
||||
![output image](../images/browser-output.png)
|
||||
![Blazor PDFViewer](../images/blazor-pdfviewer.png)
|
||||
|
||||
Download the WebAssembly application from [here](https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorWebAssembly-2083554717.zip)
|
||||
|
||||
|
|
После Ширина: | Высота: | Размер: 95 KiB |
После Ширина: | Высота: | Размер: 35 KiB |
После Ширина: | Высота: | Размер: 14 KiB |
После Ширина: | Высота: | Размер: 17 KiB |
После Ширина: | Высота: | Размер: 55 KiB |
После Ширина: | Высота: | Размер: 84 KiB |
После Ширина: | Высота: | Размер: 61 KiB |
После Ширина: | Высота: | Размер: 48 KiB |
После Ширина: | Высота: | Размер: 50 KiB |
После Ширина: | Высота: | Размер: 100 KiB |
После Ширина: | Высота: | Размер: 51 KiB |
После Ширина: | Высота: | Размер: 51 KiB |
После Ширина: | Высота: | Размер: 40 KiB |
После Ширина: | Высота: | Размер: 46 KiB |
После Ширина: | Высота: | Размер: 55 KiB |
После Ширина: | Высота: | Размер: 62 KiB |
После Ширина: | Высота: | Размер: 46 KiB |
После Ширина: | Высота: | Размер: 42 KiB |
После Ширина: | Высота: | Размер: 80 KiB |
После Ширина: | Высота: | Размер: 89 KiB |
После Ширина: | Высота: | Размер: 85 KiB |
После Ширина: | Высота: | Размер: 45 KiB |
После Ширина: | Высота: | Размер: 52 KiB |
После Ширина: | Высота: | Размер: 68 KiB |
После Ширина: | Высота: | Размер: 46 KiB |
После Ширина: | Высота: | Размер: 60 KiB |
После Ширина: | Высота: | Размер: 50 KiB |
После Ширина: | Высота: | Размер: 45 KiB |
После Ширина: | Высота: | Размер: 45 KiB |
После Ширина: | Высота: | Размер: 48 KiB |
После Ширина: | Высота: | Размер: 45 KiB |
После Ширина: | Высота: | Размер: 61 KiB |
После Ширина: | Высота: | Размер: 88 KiB |
После Ширина: | Высота: | Размер: 64 KiB |
После Ширина: | Высота: | Размер: 45 KiB |
После Ширина: | Высота: | Размер: 41 KiB |
После Ширина: | Высота: | Размер: 48 KiB |
После Ширина: | Высота: | Размер: 42 KiB |
После Ширина: | Высота: | Размер: 76 KiB |
После Ширина: | Высота: | Размер: 46 KiB |
После Ширина: | Высота: | Размер: 72 KiB |