980754: Revise UG Documentation Content for Blazor Platform(Section-4)

Author: Sridhar-Karunakaran

blazor/pivot-table/connecting-to-data-source/elasticsearch.md

@@ -22,7 +22,7 @@ This section explains how to connect the Pivot Table component to an Elasticsear
 1. Open the **NuGet Package Manager** in your project solution.
 2. Search for the **NEST** package and install it to enable connectivity with the Elasticsearch server.
 
-![Add the NuGet package "Nest" to the project](../images/Elasticsearch-nuget-package-install.png)
+![Add the NuGet package Nest to the project](../images/next-nuget-package-install.png)
 
 ### Step 3: Configure Elasticsearch Connection
 1. In the **Index.razor** page, within the `OnInitialized` method, use the **ElasticClient** class from the NEST library to establish a connection to the Elasticsearch database.
@@ -122,7 +122,7 @@ Follow these steps to create a Web API service that retrieves data from an Elast
 #### Step 2: Install the NEST NuGet Package
 1. Install the **NEST** package using the **NuGet Package Manager** to enable Elasticsearch connectivity.
 
-![Add the NuGet package "Nest" to the project](../images/Elasticsearch-nuget-package-install-in-web-service-app.png)
+![Add the NuGet package Nest to the project](../images/next-nuget-package-install.png)
 
 #### Step 3: Create a Web API Controller
 1. In the **Controllers** folder, create a new Web API controller named **PivotController.cs**.

blazor/pivot-table/connecting-to-data-source/microsoft-sql-server.md

@@ -22,7 +22,7 @@ This section describes how to connect the [Blazor Pivot Table](https://www.syncf
 1. Open the **NuGet Package Manager** in your project solution.
 2. Search for and install the [System.Data.SqlClient](https://www.nuget.org/packages/System.Data.SqlClient/4.8.5?_src=template) package to enable Microsoft SQL Server connectivity.
 
-![Add the NuGet package "System.Data.SqlClient" to the project](../images/system-Data-sql-client-nuget-package-install.png)
+![Add the NuGet package System.Data.SqlClient to the project](../images/system-Data-sql-client-nuget-package-install.png)
 
 ### Step 3: Connect to the Microsoft SQL database
 In the **Index.razor** file, under the `OnInitialized` method, use the [System.Data.SqlClient](https://www.nuget.org/packages/System.Data.SqlClient/4.8.5?_src=template) library to connect to a Microsoft SQL database and retrieve data for the Pivot Table.
@@ -117,7 +117,7 @@ Follow these steps to set up a Web API service that retrieves Microsoft SQL data
 1. Open the **NuGet Package Manager** in your project solution.
 2. Search for and install the [System.Data.SqlClient](https://www.nuget.org/packages/System.Data.SqlClient/4.8.5?_src=template) package to enable Microsoft SQL Server connectivity.
 
-![Add the NuGet package "System.Data.SqlClient" to the project](../images/system-Data-sql-client-nuget-package-install.png)
+![Add the NuGet package System.Data.SqlClient to the project](../images/system-Data-sql-client-nuget-package-install.png)
 
 #### Step 3: Create a Web API controller
 1. In the **Controllers** folder, create a new Web API controller named **PivotController.cs**.
@@ -208,7 +208,7 @@ namespace MyWebService.Controllers
 1. Access the Web API endpoint at `https://localhost:7139/Pivot` to view the JSON data retrieved from the Microsoft SQL database.
 2. The browser will display the JSON data, as shown below.
 
-![Hosted Web API URL](../images/Ms-Sql-data.png)
+![Hosted Web API URL](../images/code-web-app.jpeg)
 
 ### Connecting the Pivot Table to a Microsoft SQL database using the Web API service
 
@@ -219,7 +219,7 @@ This section explains how to connect the [Blazor Pivot Table](https://www.syncfu
 
 #### Step 2: Configure the Web API URL
 1. In the **Index.razor** file, map the Web API URL (`https://localhost:7139/Pivot`) to the Pivot Table using the [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property of [PivotViewDataSourceSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.DataSourceSettingsModel-1.html).
-2. The [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property deserializes Microsoft SQL data into instances of your model data class (e.g., `TValue="OrderDetails"`) for binding to the Pivot Table.
+2. The [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property deserialize Microsoft SQL data into instances of your model data class (e.g., `TValue="OrderDetails"`) for binding to the Pivot Table.
 
 #### Step 3: Define the Pivot Table report
 1. Configure the Pivot Table by defining fields in the [PivotViewColumns](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Columns), [PivotViewRows](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Rows), [PivotViewValues](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Values), and [PivotViewFormatSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_FormatSettings) properties.

blazor/pivot-table/connecting-to-data-source/mongodb.md

@@ -22,7 +22,7 @@ This section describes how to connect the Blazor Pivot Table to a MongoDB databa
 1. Open the **NuGet Package Manager** in your project solution.
 2. Search for the [MongoDB.Driver](https://www.nuget.org/packages/MongoDB.Driver) package and install it to enable MongoDB connectivity.
 
-![Add the NuGet package "MongoDB.Driver" to the project](../images/mongodb-nuget-package-install.png)
+![Add the NuGet package MongoDB.Driver to the project](../images/mongodb-nuget-package-install.png)
 
 ### Step 3: Connect to MongoDB
 1. In the **Index.razor** file, under the `OnInitialized` method, use the **MongoClient** class to connect to the MongoDB database with a valid connection string.
@@ -113,7 +113,7 @@ Follow these steps to set up a Web API service that retrieves MongoDB data for t
 1. Open the **NuGet Package Manager** in the project solution.
 2. Search for and install the [MongoDB.Driver](https://www.nuget.org/packages/MongoDB.Driver) package to enable MongoDB connectivity.
 
-![Add the NuGet package "MongoDB.Driver" to the project](../images/mongodb-nuget-package-install-in-web-service-app.png)
+![Add the NuGet package MongoDB.Driver to the project](../images/mongodb-nuget-package-install-in-web-service-app.png)
 
 #### Step 3: Create a Web API Controller
 1. In the **Controllers** folder, create a new Web API controller named **PivotController.cs**.

blazor/pivot-table/connecting-to-data-source/mysql.md

@@ -22,7 +22,7 @@ This section describes how to connect the [Blazor Pivot Table](https://www.syncf
 1. Open the **NuGet Package Manager** in your project solution and search for **MySql.Data**.
 2. Install the **MySql.Data** package to add MySQL database support.
 
-![Add the NuGet package "MySql.Data" to the project](../images/MySQL-nuget-package-install-in-web-service-app.png)
+![Add the NuGet package MySql.Data to the project](../images/MySQL-nuget-package-install-in-web-service-app.png)
 
 ### Step 3: Connect to MySQL
 In the **Index.razor** file, under the `OnInitialized` method, use the [MySql.Data](https://www.nuget.org/packages/MySql.Data) library to connect to a MySQL database and retrieve data for the Pivot Table.
@@ -121,7 +121,7 @@ Follow these steps to set up a Web API service that retrieves MySQL data for the
 #### Step 2: Install the MySql.Data NuGet Package
 1. Install the [MySql.Data](https://www.nuget.org/packages/MySql.Data) package using the **NuGet Package Manager** to enable MySQL connectivity.
 
-![Add the NuGet package "MySql.Data" to the project](../images/MySQL-nuget-package-install-in-web-service-app.png)
+![Add the NuGet package MySql.Data to the project](../images/MySQL-nuget-package-install-in-web-service-app.png)
 
 #### Step 3: Create a Web API Controller
 1. In the **Controllers** folder, create a new Web API controller named **PivotController.cs**.

blazor/pivot-table/connecting-to-data-source/oracledb.md

@@ -22,7 +22,7 @@ This section describes how to connect the [Blazor Pivot Table](https://www.syncf
 1. Open the **NuGet Package Manager** in your project solution and search for [Oracle.ManagedDataAccess.Core](https://www.nuget.org/packages/Oracle.ManagedDataAccess.Core/).
 2. Install the [Oracle.ManagedDataAccess.Core](https://www.nuget.org/packages/Oracle.ManagedDataAccess.Core/) package to add Oracle support.
 
-![Add the NuGet package "Oracle.ManagedDataAccess.Core" to the project](../images/oracledb-nuget-package-install.png)
+![Add the NuGet package Oracle.ManagedDataAccess.Core to the project](../images/oracledb-nuget-package-install.png)
 
 ### Step 3: Connect to the Oracle database
 In the **Index.razor** file, under the `OnInitialized` method, use the [Oracle.ManagedDataAccess](https://www.nuget.org/packages/Oracle.ManagedDataAccess) library to connect to an Oracle database and retrieve data for the Pivot Table.
@@ -130,7 +130,7 @@ Follow these steps to set up a Web API service that retrieves Oracle data for th
 #### Step 2: Install the Oracle NuGet package
 1. Install the [Oracle.ManagedDataAccess.Core](https://www.nuget.org/packages/Oracle.ManagedDataAccess.Core/) package using the **NuGet Package Manager** to enable Oracle connectivity.
 
-![Add the NuGet package "Oracle.ManagedDataAccess.Core" to the project](../images/oracledb-nuget-package-install-in-web-service-app.png)
+![Add the NuGet package Oracle.ManagedDataAccess.Core to the project](../images/oracledb-nuget-package-install-in-web-service-app.png)
 
 #### Step 3: Create a Web API controller
 1. In the **Controllers** folder, create a new Web API controller named **PivotController.cs**.
@@ -221,7 +221,7 @@ namespace MyWebService.Controllers
 1. Access the Web API endpoint at `https://localhost:44346/Pivot` to view the JSON data retrieved from Oracle.
 2. The browser will display the JSON data, as shown below.
 
-![Hosted Web API URL](../images/oracledb-data.png)
+![Hosted Web API URL](../images/oracle-code-web-app.png)
 
 ### Connecting the Pivot Table to a Oracle database using the Web API service
 
@@ -232,7 +232,7 @@ This section explains how to connect the Blazor Pivot Table to Oracle data retri
 
 #### Step 2: Configure the Web API URL
 1. In the **Index.razor** file, map the Web API URL (`https://localhost:44346/Pivot`) to the Pivot Table using the [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property of [PivotViewDataSourceSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.DataSourceSettingsModel-1.html).
-2. The [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property deserializes Oracle data into instances of your model data class (e.g., TValue="EmployeeDetails") for binding to the Pivot Table.
+2. The [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property deserialize Oracle data into instances of your model data class (e.g., TValue="EmployeeDetails") for binding to the Pivot Table.
 
 #### Step 3: Define the Pivot Table report
 1. Configure the Pivot Table by defining fields in the [PivotViewColumns](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Columns), [PivotViewRows](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Rows), [PivotViewValues](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Values), and [PivotViewFormatSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_FormatSettings) properties.

blazor/pivot-table/connecting-to-data-source/postgreSQL.md

@@ -212,7 +212,7 @@ namespace MyWebService.Controllers
 1. Access the Web API endpoint at `https://localhost:44378/Pivot` to view the JSON data retrieved from PostgreSQL.
 2. The browser will display the JSON data, as shown below.
 
-![Hosted Web API URL](../images/postgreSQL-data.png)
+![Hosted Web API URL](../images/postgresql_data.png)
 
 ### Connecting the Pivot Table to a PostgreSQL Database Using the Web API Service
 
@@ -223,7 +223,7 @@ This section explains how to connect the Blazor Pivot Table to PostgreSQL data r
 
 #### Step 2: Configure the Web API URL
 1. In the **Index.razor** file, map the Web API URL (`https://localhost:44378/Pivot`) to the Pivot Table using the [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property of [PivotViewDataSourceSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.DataSourceSettingsModel-1.html).
-2. The [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property deserializes PostgreSQL data into instances of your model data class (e.g., `TValue="PostgreSQLService"`) for binding to the Pivot Table.
+2. The [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property deserialize PostgreSQL data into instances of your model data class (e.g., `TValue="PostgreSQLService"`) for binding to the Pivot Table.
 
 #### Step 3: Define the Pivot Table Report
 1. Configure the Pivot Table by defining fields in the [PivotViewColumns](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Columns), [PivotViewRows](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Rows), [PivotViewValues](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Values), and [PivotViewFormatSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_FormatSettings) properties.

blazor/pivot-table/connecting-to-data-source/snowflakedb.md

@@ -22,7 +22,7 @@ This section describes how to connect the [Blazor Pivot Table](https://www.syncf
 1. Open the **NuGet Package Manager** in your project solution and search for [Snowflake.Data](https://www.nuget.org/packages/Snowflake.Data/).
 2. Install the [Snowflake.Data](https://www.nuget.org/packages/Snowflake.Data/) package to add Snowflake support.
 
-![Add the NuGet package "Snowflake.Data" to the project](../images/Snowflake-nuget-package-install.png)
+![Add the NuGet package Snowflake.Data to the project](../images/Snowflake-nuget-package-install.png)
 
 ### Step 3: Connect to the Snowflake Database
 In the **Index.razor** file, under the `OnInitialized` method, use the [Snowflake.Data](https://www.nuget.org/packages/Snowflake.Data) library to connect to the Snowflake database and retrieve data for the Pivot Table.
@@ -124,7 +124,7 @@ Follow these steps to set up a Web API service that retrieves Snowflake data for
 1. Open the NuGet Package Manager in your project solution.
 2. Search for and install the [Snowflake.Data](https://www.nuget.org/packages/Snowflake.Data) package to enable Snowflake connectivity.
 
-![Add the NuGet package "Snowflake.Data" to the project](../images/Snowflake-nuget-package-install-in-web-service-app.png)
+![Add the NuGet package Snowflake.Data to the project](../images/Snowflake-nuget-package-install-in-web-service-app.png)
 
 #### Step 3: Create a Web API Controller
 1. In the **Controllers** folder, create a new Web API controller named **PivotController.cs**.
@@ -228,7 +228,7 @@ This section explains how to connect the [Blazor Pivot Table](https://www.syncfu
 
 #### Step 2: Configure the Web API URL
 1. In the **Index.razor** file, map the Web API URL (`https://localhost:44378/Pivot`) to the Pivot Table using the [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property of [PivotViewDataSourceSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.DataSourceSettingsModel-1.html).
-2. The [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property deserializes Snowflake data into instances of your model data class (e.g., `TValue="SnowflakeService"`) for binding to the Pivot Table.
+2. The [Url](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Url) property deserialize Snowflake data into instances of your model data class (e.g., `TValue="SnowflakeService"`) for binding to the Pivot Table.
 
 #### Step 3: Define the Pivot Table Report
 1. Configure the Pivot Table by defining fields in the [PivotViewColumns](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Columns), [PivotViewRows](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Rows), [PivotViewValues](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_Values), and [PivotViewFormatSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewDataSourceSettings-1.html#Syncfusion_Blazor_PivotView_PivotViewDataSourceSettings_1_FormatSettings) properties.