diff --git a/Diagram/Server/Pages/Commands/AlignLeft.razor b/Diagram/Server/Pages/Commands/AlignLeft.razor
index f8f1d34b..76384c39 100644
--- a/Diagram/Server/Pages/Commands/AlignLeft.razor
+++ b/Diagram/Server/Pages/Commands/AlignLeft.razor
@@ -50,6 +50,6 @@
     //Method to align selected objects at left of the selection boundary.
     private void OnAlignLeft()
     {
-        diagram.SetAlign(AlignmentOptions.Left);
+        _diagram.SetAlign(AlignmentOptions.Left);
     }
 }
diff --git a/Diagram/Server/Pages/Commands/BringForward.razor b/Diagram/Server/Pages/Commands/BringForward.razor
index 3f324452..4414e847 100644
--- a/Diagram/Server/Pages/Commands/BringForward.razor
+++ b/Diagram/Server/Pages/Commands/BringForward.razor
@@ -13,7 +13,7 @@
     //Reference the diagram
     private SfDiagramComponent _diagram;
     //Initialize the diagram's nodes collection
-    private DiagramObjectCollection<Node> nodes = new DiagramObjectCollection<Node>();
+    private DiagramObjectCollection<Node> _nodes = new DiagramObjectCollection<Node>();
 
     protected override void OnInitialized()
     {
diff --git a/Diagram/Server/Pages/Commands/BringIntoCenter.razor b/Diagram/Server/Pages/Commands/BringIntoCenter.razor
index d93368a4..2786b29e 100644
--- a/Diagram/Server/Pages/Commands/BringIntoCenter.razor
+++ b/Diagram/Server/Pages/Commands/BringIntoCenter.razor
@@ -35,6 +35,6 @@
     private void BringIntoCenter1()
     {
         DiagramRect bound = new DiagramRect(950, 650, 500, 500);
-        diagram.BringIntoCenter(bound);
+        _diagram.BringIntoCenter(bound);
     }
 }
\ No newline at end of file
diff --git a/Diagram/Server/Pages/Commands/CustomCommands.razor b/Diagram/Server/Pages/Commands/CustomCommands.razor
index af6cfa06..d4bcb6ec 100644
--- a/Diagram/Server/Pages/Commands/CustomCommands.razor
+++ b/Diagram/Server/Pages/Commands/CustomCommands.razor
@@ -75,17 +75,17 @@
         if (args.Gesture.Modifiers == ModifierKeys.Control && args.Gesture.Key == DiagramKeys.G)
         {
             //Custom command to group the selected nodes
-            diagram.Group();
+            _diagram.Group();
         }
         if (args.Gesture.Modifiers == ModifierKeys.Control && args.Gesture.Key == DiagramKeys.U)
         {
-            DiagramSelectionSettings selector = diagram.SelectionSettings;
+            DiagramSelectionSettings selector = _diagram.SelectionSettings;
             //Custom command to ungroup the selected items
             if (selector.Nodes.Count > 0 && selector.Nodes[0] is NodeGroup)
             {
                 if ((selector.Nodes[0] as NodeGroup).Children.Length > 0)
                 {
-                    diagram.Ungroup();
+                    _diagram.Ungroup();
                 }
             }
         }
diff --git a/Diagram/Server/Pages/Commands/SendToBack.razor b/Diagram/Server/Pages/Commands/SendToBack.razor
index 0085b766..0517b611 100644
--- a/Diagram/Server/Pages/Commands/SendToBack.razor
+++ b/Diagram/Server/Pages/Commands/SendToBack.razor
@@ -48,7 +48,7 @@
             Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse },
             Style = new ShapeStyle() { Fill = "#6BA5D7", StrokeColor = "#ffff" },
         };
-        _diagramnodes.Add(node3);
+        _nodes.Add(node3);
     }
 
     private void sendToBack()
diff --git a/Diagram/Server/Pages/Commands/SetDistributeCommands.razor b/Diagram/Server/Pages/Commands/SetDistributeCommands.razor
index 51e7cc30..5728f4fa 100644
--- a/Diagram/Server/Pages/Commands/SetDistributeCommands.razor
+++ b/Diagram/Server/Pages/Commands/SetDistributeCommands.razor
@@ -18,7 +18,7 @@
 {
     private SfDiagramComponent _diagram;
     private DiagramObjectCollection<Node> _nodes = new DiagramObjectCollection<Node>();
-    private DiagramObjectCollection<Connector> Connectors = new DiagramObjectCollection<Connector>();
+    private DiagramObjectCollection<Connector> _connectors = new DiagramObjectCollection<Connector>();
 
     protected override void OnInitialized()
     {
diff --git a/Diagram/Server/Pages/Export/Export.razor b/Diagram/Server/Pages/Export/Export.razor
index 5f2e8712..9dd27b25 100644
--- a/Diagram/Server/Pages/Export/Export.razor
+++ b/Diagram/Server/Pages/Export/Export.razor
@@ -2,7 +2,7 @@
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 
-<SfButton Content="ExportBase64" OnClick="@ExportBase64" />
+<SfButton Content="ExportBase64" OnClick="@ExportBase64Async" />
 <SfButton Content="ExportPng" OnClick="@ExportPngAsync" />
 <SfDiagramComponent Height="600px" @ref="@_diagram" />
 
diff --git a/Diagram/Server/Pages/Export/ExportToPDF.razor b/Diagram/Server/Pages/Export/ExportToPDF.razor
index b5eabc29..6c9466ae 100644
--- a/Diagram/Server/Pages/Export/ExportToPDF.razor
+++ b/Diagram/Server/Pages/Export/ExportToPDF.razor
@@ -1,4 +1,4 @@
-@page "/Export"
+@page "/ExportToPdf"
 
 @using Syncfusion.PdfExport;
 @using Syncfusion.Blazor.Diagram
@@ -6,7 +6,6 @@
 @inject IJSRuntime JS;
 
 <SfButton Content="ExportPDF" OnClick="@ExportPDFAsync" />
-<SfButton Content="ExportPng" OnClick="@ExportPngAsync" />
 <SfDiagramComponent Height="600px" @ref="@_diagram" />
 
 @code
diff --git a/Diagram/Server/Pages/Group/CreateGroup.razor b/Diagram/Server/Pages/Group/CreateGroup.razor
index 2beaaf22..b88051a7 100644
--- a/Diagram/Server/Pages/Group/CreateGroup.razor
+++ b/Diagram/Server/Pages/Group/CreateGroup.razor
@@ -22,13 +22,11 @@
     {
         Node node1 = createNode("node1", 100, 100, "Node1");
         Node node2 = createNode("node2", 300, 100, "Node2");
-        Node node3 = createNode("node3", 200, 250, "Node3");
         NodeGroup groupnode = new NodeGroup();
         // Grouping node 1 and node 2 into a single group
         groupnode.Children = new string[] { "node1", "node2" };
         _nodes.Add(node1);
         _nodes.Add(node2);
-        _nodes.Add(node3);
         _nodes.Add(groupnode);
     }
 
diff --git a/Diagram/Server/Pages/Interaction/CloneSelectedItems.razor b/Diagram/Server/Pages/Interaction/CloneSelectedItems.razor
index 96768ef4..764c63d6 100644
--- a/Diagram/Server/Pages/Interaction/CloneSelectedItems.razor
+++ b/Diagram/Server/Pages/Interaction/CloneSelectedItems.razor
@@ -137,22 +137,22 @@
         List<string> child = new List<string>();
         foreach (string childID in groupNode.Children)
         {
-            for (int i = 0; i < diagram.Nodes.Count; i++)
+            for (int i = 0; i < _diagram.Nodes.Count; i++)
             {
-                if (childID == diagram.Nodes[i].ID && diagram.Nodes[i] is NodeGroup nodeGroup)
+                if (childID == _diagram.Nodes[i].ID && _diagram.Nodes[i] is NodeGroup nodeGroup)
                 {
                     child.Add(CloneGroup(nodeGroup, true));
                 }
-                else if (childID == diagram.Nodes[i].ID)
+                else if (childID == _diagram.Nodes[i].ID)
                 {
-                    child.Add(CloneNode(diagram.Nodes[i], true));
+                    child.Add(CloneNode(_diagram.Nodes[i], true));
                 }
             }
-            for (int i = 0; i < diagram.Connectors.Count; i++)
+            for (int i = 0; i < _diagram.Connectors.Count; i++)
             {
-                if (childID == diagram.Connectors[i].ID)
+                if (childID == _diagram.Connectors[i].ID)
                 {
-                    child.Add(CloneConnector(diagram.Connectors[i], true));
+                    child.Add(CloneConnector(_diagram.Connectors[i], true));
                 }
             }
         }
diff --git a/Diagram/Server/Pages/Layout/MindMapWithoutDataSource.razor b/Diagram/Server/Pages/Layout/MindMapWithoutDataSource.razor
index 96827f8c..d33d6a01 100644
--- a/Diagram/Server/Pages/Layout/MindMapWithoutDataSource.razor
+++ b/Diagram/Server/Pages/Layout/MindMapWithoutDataSource.razor
@@ -3,7 +3,7 @@
 @using Syncfusion.Blazor.Diagram
 
 <SfDiagramComponent Height="600px" Nodes="@_nodes" Connectors="@_connectors" NodeCreating="@OnNodeCreating" ConnectorCreating="@OnConnectorCreating">
-    <Layout Type="LayoutType.MindMap" Root="@root">
+    <Layout Type="LayoutType.MindMap" Root="@_root">
         <LayoutMargin Top="20" Left="20"></LayoutMargin>
     </Layout>
 </SfDiagramComponent>
diff --git a/Diagram/Server/Pages/Layout/MindmapOrientation.razor b/Diagram/Server/Pages/Layout/MindmapOrientation.razor
index bf88c324..93519e3e 100644
--- a/Diagram/Server/Pages/Layout/MindmapOrientation.razor
+++ b/Diagram/Server/Pages/Layout/MindmapOrientation.razor
@@ -26,7 +26,7 @@
         new OrientationItem { Text = "Right to Left", Value = LayoutOrientation.RightToLeft }
     };
 
-    private List<MindMapDetails> DataSource { get; set; } = new()
+    private List<MindMapDetails> _dataSource { get; set; } = new()
     {
         new MindMapDetails { Id = "1", Label = "Project Planning", ParentId = "", Branch = "Root" },
         new MindMapDetails { Id = "2", Label = "Requirements", ParentId = "1", Branch = "Right" },
@@ -51,7 +51,7 @@
     // Method triggered by button click at runtime to set diagram orientation to vertical.
     private void ChangeLayoutOrientation()
     {
-       _diagram?.Layout.Orientation = LayoutOrientation.Vertical;
+       _diagram!.Layout.Orientation = LayoutOrientation.Vertical;
     }
 
     private void OnNodeCreating(IDiagramObject obj)
diff --git a/Diagram/Server/Pages/Layout/MindmapOrientationRuntime.razor b/Diagram/Server/Pages/Layout/MindmapOrientationRuntime.razor
index 9d985dd4..99beeb4f 100644
--- a/Diagram/Server/Pages/Layout/MindmapOrientationRuntime.razor
+++ b/Diagram/Server/Pages/Layout/MindmapOrientationRuntime.razor
@@ -64,7 +64,7 @@
     // Method triggered by button click at runtime to set diagram orientation to vertical.
     private void ChangeLayoutOrientation()
     {
-       _diagram?.Layout.Orientation = LayoutOrientation.Vertical;
+       _diagram!.Layout.Orientation = LayoutOrientation.Vertical;
     }
 
     private void OnNodeCreating(IDiagramObject obj)
diff --git a/Diagram/Server/Pages/Layout/OrganizationLayout2.razor b/Diagram/Server/Pages/Layout/OrganizationLayout2.razor
index 89e7aaf0..0407aa75 100644
--- a/Diagram/Server/Pages/Layout/OrganizationLayout2.razor
+++ b/Diagram/Server/Pages/Layout/OrganizationLayout2.razor
@@ -11,7 +11,7 @@
         <VerticalGridLines LineColor="white" LineDashArray="2,2">
         </VerticalGridLines>
     </SnapSettings>
-    <Layout Type="LayoutType.OrganizationalChart" @bind-HorizontalSpacing="@HorizontalSpacing" @bind-VerticalSpacing="@VerticalSpacing" GetLayoutInfo="GetLayoutInfo">
+    <Layout Type="LayoutType.OrganizationalChart" @bind-HorizontalSpacing="@_horizontalSpacing" @bind-VerticalSpacing="@_verticalSpacing" GetLayoutInfo="GetLayoutInfo">
     </Layout>
 </SfDiagramComponent>
 
diff --git a/Diagram/Server/Pages/Layout/RadialTreeWithNodes.razor b/Diagram/Server/Pages/Layout/RadialTreeWithNodes.razor
index 7088d790..c3364223 100644
--- a/Diagram/Server/Pages/Layout/RadialTreeWithNodes.razor
+++ b/Diagram/Server/Pages/Layout/RadialTreeWithNodes.razor
@@ -39,7 +39,7 @@
                 Width = 70,
                 Height = 70,
             };
-            nodes.Add(node1);
+            _nodes.Add(node1);
         }
         Connector connector1 = new Connector() { ID = "connector1", SourceID = "node1", TargetID = "node2" };
         _connectors.Add(connector1);
diff --git a/Diagram/Server/Pages/Ports/ActionofPorts/AddPortsAsync.razor b/Diagram/Server/Pages/Ports/ActionofPorts/AddPortsAsync.razor
index 2a4ba549..8b186bc8 100644
--- a/Diagram/Server/Pages/Ports/ActionofPorts/AddPortsAsync.razor
+++ b/Diagram/Server/Pages/Ports/ActionofPorts/AddPortsAsync.razor
@@ -12,7 +12,7 @@
     protected override void OnInitialized()
     {
         //A node is created and stored in nodes array.
-        nodes = new DiagramObjectCollection<Node>();
+        _nodes = new DiagramObjectCollection<Node>();
         Node node = new Node()
         {
             //Position of the node.
diff --git a/Diagram/Server/Pages/Ports/NodePortConnection/NodePortConnection.razor b/Diagram/Server/Pages/Ports/NodePortConnection/NodePortConnection.razor
index 09984c05..bd5fdd12 100644
--- a/Diagram/Server/Pages/Ports/NodePortConnection/NodePortConnection.razor
+++ b/Diagram/Server/Pages/Ports/NodePortConnection/NodePortConnection.razor
@@ -1,7 +1,7 @@
 @page "/NodePortConnection"
 @using Syncfusion.Blazor.Diagram
 
-<SfDiagramComponent Height="600px" Nodes="@nodes" Connectors="@_connectors">
+<SfDiagramComponent Height="600px" Nodes="@_nodes" Connectors="@_connectors">
     <SnapSettings Constraints="SnapConstraints.None"></SnapSettings>
 </SfDiagramComponent>
 
diff --git a/Diagram/Server/Pages/Serialization/Mermaid.razor b/Diagram/Server/Pages/Serialization/Mermaid.razor
index 1654d3d9..55d821fd 100644
--- a/Diagram/Server/Pages/Serialization/Mermaid.razor
+++ b/Diagram/Server/Pages/Serialization/Mermaid.razor
@@ -30,7 +30,7 @@
     private LayoutOrientation _oreintation = LayoutOrientation.TopToBottom;
     private HorizontalAlignment _horizontalAlignment = HorizontalAlignment.Auto;
     private VerticalAlignment _verticalAlignment = VerticalAlignment.Auto;
-    private int _vorizontalSpacing = 30;
+    private int _horizontalSpacing = 30;
     private int _verticalSpacing = 30;
     private string _data = string.Empty;
     private bool _isLoading = false;
@@ -256,7 +256,7 @@
         node.Height = 100; node.Width = 100;
         node.Style.Fill = "#BB9AB1";
         
-        if (!IsLoading)
+        if (!_isLoading)
         {
             node.Shape = new BasicShape() { Type = NodeShapes.Basic, Shape = NodeBasicShapes.Ellipse };
             node.Annotations = new DiagramObjectCollection<ShapeAnnotation>()
diff --git a/Diagram/Server/Pages/Serialization/SaveLoad/SaveAndLoadSample.razor b/Diagram/Server/Pages/Serialization/SaveLoad/SaveAndLoadSample.razor
index f016055c..bc544902 100644
--- a/Diagram/Server/Pages/Serialization/SaveLoad/SaveAndLoadSample.razor
+++ b/Diagram/Server/Pages/Serialization/SaveLoad/SaveAndLoadSample.razor
@@ -1,5 +1,6 @@
 @page "/saveAndLoad"
 
+@using Diagram.Server.Pages.Serialization.SaveLoad
 @using Syncfusion.Blazor.Diagram
 @using Syncfusion.Blazor.Buttons
 @using Microsoft.JSInterop
diff --git a/Diagram/Server/Pages/Swimlanes/ChildrenSpacingProperty/ChildrenSpacingProperty.razor b/Diagram/Server/Pages/Swimlanes/ChildrenSpacingProperty/ChildrenSpacingProperty.razor
index 0677f29f..45b435fb 100644
--- a/Diagram/Server/Pages/Swimlanes/ChildrenSpacingProperty/ChildrenSpacingProperty.razor
+++ b/Diagram/Server/Pages/Swimlanes/ChildrenSpacingProperty/ChildrenSpacingProperty.razor
@@ -47,6 +47,8 @@
                 ID = "swimlane1",
                 Height = 200,
                 Width = 450,
+                OffsetX = 300,
+                OffsetY = 300,
                 Header = new SwimlaneHeader()
                 {
                     Annotation = new ShapeAnnotation()
diff --git a/Diagram/Server/Pages/SymbolPalette/GroupSample.razor b/Diagram/Server/Pages/SymbolPalette/GroupSample.razor
index 253d65eb..b13b62ca 100644
--- a/Diagram/Server/Pages/SymbolPalette/GroupSample.razor
+++ b/Diagram/Server/Pages/SymbolPalette/GroupSample.razor
@@ -139,7 +139,7 @@
         </div>
         <div id="diagram-space" class="sb-mobile-diagram">
             <div class="content-wrapper" style="border: 1px solid #D7D7D7">
-                <SfDiagramComponent @ref="@diagram" Height="700px" Connectors="@connectors" Nodes="@nodes">
+                <SfDiagramComponent @ref="@_diagram" Height="700px" Connectors="@_connectors" Nodes="@_nodes">
                 </SfDiagramComponent>
             </div>
         </div>
diff --git a/Diagram/Server/Pages/SymbolPalette/SymbolDescriptionSample.razor b/Diagram/Server/Pages/SymbolPalette/SymbolDescriptionSample.razor
index 67a1f004..2c70b739 100644
--- a/Diagram/Server/Pages/SymbolPalette/SymbolDescriptionSample.razor
+++ b/Diagram/Server/Pages/SymbolPalette/SymbolDescriptionSample.razor
@@ -39,9 +39,9 @@
     private void InitPaletteModel()
     {
         CreatePaletteNode(NodeBasicShapes.Rectangle, "Rectangle");
-        Palettes = new DiagramObjectCollection<Palette>()
+        _palettes = new DiagramObjectCollection<Palette>()
         {
-           new Palette(){Symbols = PaletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" },
+           new Palette(){Symbols = _paletteNodes,Title = "Basic Shapes", ID = "Basic Shapes" },
         };
     }
 
diff --git a/Diagram/Server/Pages/SymbolPalette/SymbolStretch.razor b/Diagram/Server/Pages/SymbolPalette/SymbolStretch.razor
index b8e31417..890e2c9d 100644
--- a/Diagram/Server/Pages/SymbolPalette/SymbolStretch.razor
+++ b/Diagram/Server/Pages/SymbolPalette/SymbolStretch.razor
@@ -6,8 +6,8 @@
 <div class="control-section">
     <div style="width:20%">
         <div id="palette-space" class="sb-mobile-palette" style="border: 2px solid #b200ff">
-            <SfSymbolPaletteComponent @ref="@symbolpalette" Height="300px" Width="200px" GetSymbolInfo="GetSymbolInfo"
-                                      Palettes="@Palettes" SymbolHeight="60" SymbolWidth="120" SymbolMargin="@SymbolMargin">
+            <SfSymbolPaletteComponent @ref="@_symbolPalette" Height="300px" Width="200px" GetSymbolInfo="GetSymbolInfo"
+                                      Palettes="@_palettes" SymbolHeight="60" SymbolWidth="120" SymbolMargin="@_symbolMargin">
             </SfSymbolPaletteComponent>
         </div>
     </div>
diff --git a/Diagram/Server/Server_NET9.csproj b/Diagram/Server/Server_NET9.csproj
index 4876429d..ee2e0f2d 100644
--- a/Diagram/Server/Server_NET9.csproj
+++ b/Diagram/Server/Server_NET9.csproj
@@ -6,6 +6,7 @@
     <ImplicitUsings>enable</ImplicitUsings>
   </PropertyGroup>
   <ItemGroup>
+    <PackageReference Include="Syncfusion.Blazor.CircularGauge" Version="*" />
     <PackageReference Include="Syncfusion.Blazor.Diagram" Version="*" />
     <PackageReference Include="Syncfusion.Blazor.Themes" Version="*" />
   </ItemGroup>