Skip to content

Commit e184021

Browse files
ParameshwaranSF4845ParameshwaranSF4845
committed
970731: MindMap sample added
1 parent af59461 commit e184021

File tree

20 files changed

+1034
-21
lines changed

20 files changed

+1034
-21
lines changed

‎UG-Samples/Layout/MindmapOrientation/MindMapOrientation/Components/Pages/Index.razor‎

Lines changed: 557 additions & 15 deletions
Large diffs are not rendered by default.

‎UG-Samples/Layout/MindmapOrientation/MindMapOrientation/MindMapOrientation_NET8.csproj‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,8 @@
77
</PropertyGroup>
88

99
<ItemGroup>
10-
<PackageReference Include="Syncfusion.Blazor.Diagram" Version="30.1.41" />
11-
<PackageReference Include="Syncfusion.Blazor.DropDowns" Version="30.1.41" />
12-
<PackageReference Include="Syncfusion.Blazor.Themes" Version="30.1.41" />
10+
<PackageReference Include="Syncfusion.Blazor.Diagram" Version="*" />
11+
<PackageReference Include="Syncfusion.Blazor.Themes" Version="*" />
1312
</ItemGroup>
1413

1514
</Project>

‎UG-Samples/Layout/MindmapOrientation/MindMapOrientation/MindMapOrientation_NET9.csproj‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,8 @@
77
</PropertyGroup>
88

99
<ItemGroup>
10-
<PackageReference Include="Syncfusion.Blazor.Diagram" Version="30.1.41" />
11-
<PackageReference Include="Syncfusion.Blazor.DropDowns" Version="30.1.41" />
12-
<PackageReference Include="Syncfusion.Blazor.Themes" Version="30.1.41" />
10+
<PackageReference Include="Syncfusion.Blazor.Diagram" Version="*" />
11+
<PackageReference Include="Syncfusion.Blazor.Themes" Version="*" />
1312
</ItemGroup>
1413

1514
</Project>

‎UG-Samples/Layout/MindmapOrientationRuntime/MindmapOrientationRuntime/App.razor‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<Router AppAssembly="@typeof(App).Assembly">
2+
<Found Context="routeData">
3+
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
4+
<FocusOnNavigate RouteData="@routeData" Selector="h1" />
5+
</Found>
6+
<NotFound>
7+
<PageTitle>Not found</PageTitle>
8+
<LayoutView Layout="@typeof(MainLayout)">
9+
<p role="alert">Sorry, there's nothing at this address.</p>
10+
</LayoutView>
11+
</NotFound>
12+
</Router>

‎UG-Samples/Layout/MindmapOrientationRuntime/MindmapOrientationRuntime/MindmapOrientationRuntimeNET8.csproj‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<Project Sdk="Microsoft.NET.Sdk.Web">
2+
3+
<PropertyGroup>
4+
<TargetFramework>net8.0</TargetFramework>
5+
<Nullable>enable</Nullable>
6+
<ImplicitUsings>enable</ImplicitUsings>
7+
</PropertyGroup>
8+
9+
<ItemGroup>
10+
<PackageReference Include="Syncfusion.Blazor.Diagram" Version="*" />
11+
<PackageReference Include="Syncfusion.Blazor.Themes" Version="*" />
12+
</ItemGroup>
13+
14+
</Project>

‎UG-Samples/Layout/MindmapOrientationRuntime/MindmapOrientationRuntime/MindmapOrientationRuntimeNET9.csproj‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<Project Sdk="Microsoft.NET.Sdk.Web">
2+
3+
<PropertyGroup>
4+
<TargetFramework>net9.0</TargetFramework>
5+
<Nullable>enable</Nullable>
6+
<ImplicitUsings>enable</ImplicitUsings>
7+
</PropertyGroup>
8+
9+
<ItemGroup>
10+
<PackageReference Include="Syncfusion.Blazor.Diagram" Version="*" />
11+
<PackageReference Include="Syncfusion.Blazor.Themes" Version="*" />
12+
</ItemGroup>
13+
14+
</Project>

‎UG-Samples/Layout/MindmapOrientationRuntime/MindmapOrientationRuntime/Pages/Index.razor‎

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
@page "/"
2+
@using Syncfusion.Blazor.Diagram
3+
@using Syncfusion.Blazor.DropDowns
4+
@using Syncfusion.Blazor.Buttons
5+
6+
<div style="display:grid;gap:20px;">
7+
<SfDiagramComponent @ref="diagram" Height="600px" NodeCreating="OnNodeCreating" ConnectorCreating="OnConnectorCreating">
8+
<RulerSettings>
9+
<HorizontalRuler></HorizontalRuler>
10+
<VerticalRuler></VerticalRuler>
11+
</RulerSettings>
12+
<DataSourceSettings ID="Id" ParentID="ParentId" DataSource="DataSource">
13+
</DataSourceSettings>
14+
<Layout Type="LayoutType.MindMap" @bind-Orientation="SelectedOrientation" GetBranch="GetBranch"
15+
HorizontalSpacing="50">
16+
<LayoutMargin Top="20" Left="20"></LayoutMargin>
17+
</Layout>
18+
</SfDiagramComponent>
19+
<div style="display:flex;gap:20px;">
20+
<SfDropDownList TValue="LayoutOrientation" TItem="OrientationItem" DataSource="LayoutOrientationOptions"
21+
@bind-Value="SelectedOrientation" Placeholder="Select Orientation" Width="300px">
22+
<DropDownListFieldSettings Text="Text" Value="Value"></DropDownListFieldSettings>
23+
</SfDropDownList>
24+
<SfButton Content="Set to Vertical" IsPrimary="true" IconCss="e-icons e-refresh" OnClick="ChangeLayoutOrientation">
25+
</SfButton>
26+
</div>
27+
</div>
28+
@code {
29+
private SfDiagramComponent? diagram;
30+
31+
// Property bound to dropdown and diagram layout, updated at runtime by user interaction
32+
public LayoutOrientation SelectedOrientation { get; set; } = LayoutOrientation.Vertical;
33+
34+
public List<OrientationItem> LayoutOrientationOptions { get; set; } = new()
35+
{
36+
new OrientationItem { Text = "Vertical", Value = LayoutOrientation.Vertical },
37+
new OrientationItem { Text = "Horizontal", Value = LayoutOrientation.Horizontal },
38+
new OrientationItem { Text = "Left to Right", Value = LayoutOrientation.LeftToRight },
39+
new OrientationItem { Text = "Right to Left", Value = LayoutOrientation.RightToLeft }
40+
};
41+
42+
public List<MindMapDetails> DataSource { get; set; } = new()
43+
{
44+
new MindMapDetails { Id = "1", Label = "Project Planning", ParentId = "", Branch = "Root" },
45+
new MindMapDetails { Id = "2", Label = "Requirements", ParentId = "1", Branch = "Right" },
46+
new MindMapDetails { Id = "3", Label = "Design", ParentId = "1", Branch = "Right" },
47+
new MindMapDetails { Id = "5", Label = "Stakeholder Analysis", ParentId = "2", Branch = "SubRight" },
48+
new MindMapDetails { Id = "6", Label = "Documentation", ParentId = "2", Branch = "SubRight" },
49+
new MindMapDetails { Id = "7", Label = "UI Design", ParentId = "3", Branch = "SubRight" },
50+
new MindMapDetails { Id = "8", Label = "Database Design", ParentId = "3", Branch = "SubRight" }
51+
};
52+
53+
private BranchType GetBranch(IDiagramObject obj)
54+
{
55+
if (obj is not Node node)
56+
return BranchType.Left;
57+
58+
if (node.Data is not MindMapDetails mindMapData || string.IsNullOrWhiteSpace(mindMapData.Branch))
59+
return BranchType.Left;
60+
61+
return Enum.TryParse(mindMapData.Branch, out BranchType branchType)
62+
? branchType
63+
: BranchType.SubLeft;
64+
}
65+
66+
// Method triggered by button click at runtime to set diagram orientation to vertical
67+
private void ChangeLayoutOrientation()
68+
{
69+
diagram.Layout.Orientation = LayoutOrientation.Vertical;
70+
}
71+
72+
private void OnNodeCreating(IDiagramObject obj)
73+
{
74+
if (obj is not Node node)
75+
return;
76+
// Apply default node styling
77+
node.Height = 100;
78+
node.Width = 100;
79+
node.BackgroundColor = "#6BA5D7";
80+
node.Style = new ShapeStyle
81+
{
82+
Fill = "#6495ED",
83+
StrokeWidth = 1,
84+
StrokeColor = "white"
85+
};
86+
node.Shape = new BasicShape { Type = NodeShapes.Basic };
87+
// Add annotation with label from data
88+
if (node.Data is MindMapDetails mindMapData && !string.IsNullOrWhiteSpace(mindMapData.Label))
89+
{
90+
node.Annotations = new DiagramObjectCollection<ShapeAnnotation>
91+
{
92+
new ShapeAnnotation { Content = mindMapData.Label }
93+
};
94+
}
95+
}
96+
97+
private void OnConnectorCreating(IDiagramObject obj)
98+
{
99+
if (obj is not Connector connector)
100+
return;
101+
102+
connector.Type = ConnectorSegmentType.Bezier;
103+
connector.Style = new ShapeStyle
104+
{
105+
StrokeColor = "#6495ED",
106+
StrokeWidth = 2
107+
};
108+
connector.TargetDecorator = new DecoratorSettings
109+
{
110+
Shape = DecoratorShape.None
111+
};
112+
}
113+
114+
public class OrientationItem
115+
{
116+
public string Text { get; set; } = string.Empty;
117+
public LayoutOrientation Value { get; set; }
118+
}
119+
120+
public class MindMapDetails
121+
{
122+
public string Id { get; set; } = string.Empty;
123+
public string Label { get; set; } = string.Empty;
124+
public string ParentId { get; set; } = string.Empty;
125+
public string Branch { get; set; } = string.Empty;
126+
public string Fill { get; set; } = string.Empty;
127+
}
128+
}

‎UG-Samples/Layout/MindmapOrientationRuntime/MindmapOrientationRuntime/Pages/_Host.cshtml‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
@page "/"
2+
@using Microsoft.AspNetCore.Components.Web
3+
@namespace MindmapOrientationRuntime.Pages
4+
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
5+
6+
<!DOCTYPE html>
7+
<html lang="en">
8+
<head>
9+
<meta charset="utf-8" />
10+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
11+
<base href="~/" />
12+
<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
13+
<link href="css/site.css" rel="stylesheet" />
14+
<link href="MindmapOrientationRuntime.styles.css" rel="stylesheet" />
15+
<link rel="icon" type="image/png" href="favicon.png"/>
16+
<component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />
17+
<link href="_content/Syncfusion.Blazor.Themes/bootstrap5.css" rel="stylesheet" />
18+
<script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>
19+
</head>
20+
<body>
21+
<component type="typeof(App)" render-mode="ServerPrerendered" />
22+
23+
<div id="blazor-error-ui">
24+
<environment include="Staging,Production">
25+
An error has occurred. This application may no longer respond until reloaded.
26+
</environment>
27+
<environment include="Development">
28+
An unhandled exception has occurred. See browser dev tools for details.
29+
</environment>
30+
<a href="" class="reload">Reload</a>
31+
<a class="dismiss">🗙</a>
32+
</div>
33+
34+
<script src="_framework/blazor.server.js"></script>
35+
</body>
36+
</html>

‎UG-Samples/Layout/MindmapOrientationRuntime/MindmapOrientationRuntime/Program.cs‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
using Microsoft.AspNetCore.Components;
2+
using Microsoft.AspNetCore.Components.Web;
3+
using Syncfusion.Blazor;
4+
5+
6+
var builder = WebApplication.CreateBuilder(args);
7+
8+
// Add services to the container.
9+
builder.Services.AddRazorPages();
10+
builder.Services.AddServerSideBlazor();
11+
builder.Services.AddSyncfusionBlazor();
12+
13+
var app = builder.Build();
14+
15+
// Configure the HTTP request pipeline.
16+
if (!app.Environment.IsDevelopment())
17+
{
18+
app.UseExceptionHandler("/Error");
19+
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
20+
app.UseHsts();
21+
}
22+
23+
app.UseHttpsRedirection();
24+
25+
app.UseStaticFiles();
26+
27+
app.UseRouting();
28+
29+
app.MapBlazorHub();
30+
app.MapFallbackToPage("/_Host");
31+
32+
app.Run();

‎UG-Samples/Layout/MindmapOrientationRuntime/MindmapOrientationRuntime/Properties/launchSettings.json‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
{
2+
"iisSettings": {
3+
"windowsAuthentication": false,
4+
"anonymousAuthentication": true,
5+
"iisExpress": {
6+
"applicationUrl": "http://localhost:59683",
7+
"sslPort": 44345
8+
}
9+
},
10+
"profiles": {
11+
"http": {
12+
"commandName": "Project",
13+
"dotnetRunMessages": true,
14+
"launchBrowser": true,
15+
"applicationUrl": "http://localhost:5133",
16+
"environmentVariables": {
17+
"ASPNETCORE_ENVIRONMENT": "Development"
18+
}
19+
},
20+
"https": {
21+
"commandName": "Project",
22+
"dotnetRunMessages": true,
23+
"launchBrowser": true,
24+
"applicationUrl": "https://localhost:7264;http://localhost:5133",
25+
"environmentVariables": {
26+
"ASPNETCORE_ENVIRONMENT": "Development"
27+
}
28+
},
29+
"IIS Express": {
30+
"commandName": "IISExpress",
31+
"launchBrowser": true,
32+
"environmentVariables": {
33+
"ASPNETCORE_ENVIRONMENT": "Development"
34+
}
35+
}
36+
}
37+
}

0 commit comments

Comments
 (0)