protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
HTMLBinding.Model.Width = "100%";
HTMLBinding.Model.Height = "490px";
HTMLBinding.Model.DataSourceSettings.Parent = "ReportingPerson";
HTMLBinding.Model.DataSourceSettings.Id = "Id";
HTMLBinding.Model.DefaultSettings.Node = new Node()
{
Width = 100,
Height = 40,
BorderColor = "transparent"
};
Label label = new Label()
{
FontColor = "#ffffff"
};
HTMLBinding.Model.DefaultSettings.Node.Labels.Add(label);
HTMLBinding.Model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.Arrow, BorderColor = "#4F4F4F", FillColor = "#4F4F4F"
}
};
HTMLBinding.Model.SnapSettings.SnapConstraints = SnapConstraints.None;
HTMLBinding.Model.EnableContextMenu = false;
HTMLBinding.Model.NodeTemplate = "nodeTemplate";
}
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
UniversityChart.Model.DataSourceSettings.DataSource = GetUniversityChartData();
UniversityChart.Model.DataSourceSettings.Parent = "Supervision";
UniversityChart.Model.DataSourceSettings.Id = "Id";
UniversityChart.Model.Layout.GetLayoutInfo = "getLayoutInfo";
UniversityChart.Model.DefaultSettings.Node = new Node()
{
Width = 130, Height = 40, BorderColor = "transparent"
};
Label label = new Label()
{
Name = "label1", Margin = new LabelMargin(0, 5, 5, 0), FontColor = "#ffffff"
};
UniversityChart.Model.DefaultSettings.Node.Labels.Add(label);
UniversityChart.Model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.None
},
Constraints = ConnectorConstraints.None
};
UniversityChart.Model.NodeTemplate = "nodeTemplate";
}
}
private Node CreateDiagramNode(string name, int width, int height, double x, double y, string text, float labelX, float labelY, string fillColor)
{
BasicShape node = new BasicShape();
node.Name = name;
node.Width = width;
node.Height = height;
if (fillColor != null)
{
node.FillColor = fillColor;
}
node.OffsetX = x;
node.OffsetY = y;
Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label label = new Label()
{
Text = text, FontSize = 18, FontFamily = "segoe UI"
};
if (labelX != 0 && labelY != 0)
{
label.Offset = new DiagramPoint()
{
X = labelX, Y = labelY
}
}
;
node.Labels.Add(label);
return(node);
}
}
private BPMNNode CreateBPMN(String name, BPMNShapes shape, double width, double height, double offsetx, double offsety, string text = "")
{
BPMNNode node = new BPMNNode();
node.Name = name;
node.Shape = shape;
node.Width = width;
node.Height = height;
node.OffsetX = offsetx;
node.OffsetY = offsety;
Label label = new Label();
label.Text = text;
label.FontColor = "black";
if (shape == BPMNShapes.Event && shape == BPMNShapes.Activity && text != "")
{
label.Offset = new DiagramPoint()
{
Y = 1
};
label.VerticalAlignment = VerticalAlignment.Top;
}
else
{
label.Offset = new DiagramPoint()
{
Y = 0.5f
}
};
node.Labels.Add(label);
DiagramContent.Nodes.Add(node);
return(node);
}
private BPMNNode CreateBPMNNode(String name, BPMNShapes shape, double width, double height, double offsetx, double offsety, double marginleft, double margintop, string text = "")
{
BPMNNode node = new BPMNNode();
node.Name = name;
node.Shape = shape;
node.Width = width;
node.Height = height;
node.OffsetX = offsetx;
node.OffsetY = offsety;
node.MarginLeft = marginleft;
node.MarginTop = margintop;
Label label = new Label();
label.Text = text;
label.FontColor = "black";
if (shape == BPMNShapes.Event && text != "")
{
label.Offset = new DiagramPoint()
{
Y = 1
};
label.VerticalAlignment = VerticalAlignment.Top;
}
else
{
label.Offset = new DiagramPoint()
{
Y = 0.5f
};
}
node.Labels.Add(label);
DiagramWebControl1.Model.Nodes.Add(node);
return(node);
}
private void initializeNode(Node node, string type, string text, string fill)
{
node.Name = "node_" + DiagramWebControl1.Model.Nodes.Count;
LabelMargin margin = new LabelMargin(5, 5, 5, 5);
Label label = new Label();
label.Text = text;
label.Name = node.Name + "_label";
label.Wrapping = TextWrapping.NoWrap;
label.Margin = margin;
label.Bold = true;
label.FontFamily = "Segoe UI";
node.Labels.Add(label);
node.FillColor = fill;
node.Visible = false;
node.MinWidth = 50;
node.MinHeight = 30;
node.Constraints = node.Constraints & ~(NodeConstraints.Drag | NodeConstraints.Rotate);
if (node is NativeNode)
{
(node as NativeNode).Scale = ScaleConstraints.Stretch;
}
if (type == "root")
{
node.Constraints = node.Constraints & ~NodeConstraints.Delete;
}
Dictionary <string, object> addInfo = new Dictionary <string, object>();
addInfo.Add("type", type);
node.AddInfo = addInfo;
DiagramWebControl1.Model.Nodes.Add(node);
}
private FlowShape CreateFlowShape(String name, FlowShapes shape, double width, double height, double offsetx, double offsety, string labelText, Collection nodes, bool addPorts = false)
{
FlowShape node = new FlowShape();
node.Name = name;
node.Width = width;
node.Shape = shape;
node.Height = height;
node.OffsetX = offsetx;
node.BorderColor = "#000000";
node.FillColor = "#6bbd45";
node.OffsetY = offsety;
Label label = new Label();
label.Margin = new LabelMargin()
{
Bottom = 2, Top = 2, Left = 20, Right = 20
};
label.Text = labelText;
label.FontColor = "white";
label.Name = name + "_label";
node.Labels.Add(label);
node.Constraints = NodeConstraints.Default & ~NodeConstraints.Drag;
if (addPorts)
{
AddPorts(node);
}
nodes.Add(node);
return(node);
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BusinessChart.Model.DataSourceSettings.DataSource = GetBusinessChartData();
BusinessChart.Model.DataSourceSettings.Parent = "Manager";
BusinessChart.Model.DataSourceSettings.Id = "Id";
BusinessChart.Model.Layout.GetLayoutInfo = "getLayoutInfo";
BusinessChart.Model.DefaultSettings.Node = new Node()
{
Width = 150, Height = 50, BorderColor = "transparent"
};
Label label = new Label()
{
FontColor = "#ffffff", Margin = new LabelMargin()
{
Left = 5, Right = 5
}
};
BusinessChart.Model.DefaultSettings.Node.Labels.Add(label);
BusinessChart.Model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.None
},
Constraints = ConnectorConstraints.None
};
BusinessChart.Model.NodeTemplate = "nodeTemplate";
}
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
RemoteChart.Model.DefaultSettings.Node = new Node()
{
Width = 100,
Height = 40,
BorderColor = "transparent"
};
Label label = new Label()
{
Bold = true, FontColor = "#ffffff"
};
RemoteChart.Model.DefaultSettings.Node.Labels.Add(label);
RemoteChart.Model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Straight)
}
};
RemoteChart.Model.SnapSettings.SnapConstraints = SnapConstraints.None;
RemoteChart.Model.PageSettings.ScrollLimit = ScrollLimit.Diagram;
}
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
LocalData.Model.DataSourceSettings.DataSource = GetLocalData();
LocalData.Model.DataSourceSettings.Parent = "TeamLead";
LocalData.Model.DataSourceSettings.Id = "Id";
LocalData.Model.DefaultSettings.Node = new Node()
{
Width = 110, Height = 40, BorderColor = "transparent"
};
Label label = new Label()
{
FontColor = "#ffffff", Margin = new LabelMargin()
{
Left = 5, Right = 5
}
};
LocalData.Model.DefaultSettings.Node.Labels.Add(label);
LocalData.Model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.Arrow, BorderColor = "#4F4F4F", FillColor = "#4F4F4F"
},
Constraints = ConnectorConstraints.None
};
LocalData.Model.NodeTemplate = "nodeTemplate";
}
}
private Connector ConnectDiagramNode(DiagramProperties model, Node targetNode, Node sourceNode, string labelText)
{
Connector connector = new Connector();
connector.Name = "line" + model.Connectors.Count + 1;
connector.Segments = new Collection();
Segment seg = new Syncfusion.JavaScript.DataVisualization.Models.Diagram.Segment(Segments.Orthogonal);
connector.Segments.Add(seg);
connector.TargetNode = targetNode.Name;
connector.SourceNode = sourceNode.Name;
connector.LineWidth = 2;
if (!string.IsNullOrEmpty(labelText))
{
Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label label = new Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label();
label.FontColor = "black";
label.FillColor = "white";
label.Text = labelText;
connector.Labels.Add(label);
}
connector.SourceDecorator.Shape = Syncfusion.JavaScript.DataVisualization.DiagramEnums.DecoratorShapes.Arrow;
connector.TargetDecorator.Shape = Syncfusion.JavaScript.DataVisualization.DiagramEnums.DecoratorShapes.None;
connector.TargetDecorator.BorderColor = "#606060";
connector.TargetDecorator.Width = 10;
connector.TargetDecorator.Height = 10;
model.Connectors.Add(connector);
return(connector);
}
private Node CreateNode(string name, double width, double height, double offsetx, double offsety, BasicShapes shape, string text, double corner, string fillColor, double opacity)
{
BasicShape node = new BasicShape();
node.Name = name;
node.Width = width;
node.Height = height;
node.OffsetX = offsetx;
node.OffsetY = offsety;
node.FillColor = fillColor;
node.CornerRadius = corner;
node.Type = Shapes.Basic;
node.BorderColor = "transparent";
node.Opacity = opacity;
Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label label = new Label()
{
Text = text, FontSize = 18, FontFamily = "segoe", FontColor = "white", Bold = true
};
node.Labels.Add(label);
if (shape != null)
{
node.Shape = shape;
}
else
{
node.Shape = BasicShapes.Rectangle;
}
return(node);
}
private Node CreateNativeNode(string name, double width, double height, double x, double y, string id, string text, string position, double angle, string border)
{
NativeNode node = new NativeNode();
node.Name = name;
node.Width = width;
node.OffsetX = x;
node.OffsetY = y;
node.Height = height;
node.TemplateId = id;
node.RotateAngle = angle;
node.Type = Shapes.Native;
node.TemplateId = id;
node.Scale = ScaleConstraints.Stretch;
if (border != null)
{
node.BorderColor = border;
}
else
{
node.BorderColor = "gray";
}
string fontColor = "black";
HorizontalAlignment horizontalAlignment = HorizontalAlignment.Center;
Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label label = new Label()
{
Text = text, FontSize = 18, FontFamily = "segoe UI", FontColor = fontColor, Bold = true, HorizontalAlignment = horizontalAlignment, Wrapping = TextWrapping.NoWrap
};
if (position == "top")
{
label.Offset = new DiagramPoint()
{
X = .5f, Y = -.45f
}
}
;
else if (position == "bottom")
{
label.Offset = new DiagramPoint()
{
X = 0.5f, Y = 1.49f
}
}
;
if (position == "right")
{
label.Offset = new DiagramPoint()
{
X = 1.1f, Y = .5f
};
label.HorizontalAlignment = HorizontalAlignment.Left;
label.FontColor = "black";
label.FontSize = 18;
}
node.Labels.Add(label);
return(node);
}
//
// GET: /HierarchicalLayout/
public ActionResult HierarchicalLayout()
{
DiagramProperties model = new DiagramProperties();
model.Height = "400px";
model.Width = "100%";
model.PageSettings.ScrollLimit = ScrollLimit.Diagram;
model.Layout.Type = LayoutTypes.HierarchicalTree;
model.Layout.HorizontalSpacing = 25;
model.Layout.VerticalSpacing = 35;
model.Layout.Margin.Left = 0;
model.Layout.Margin.Top = 10;
model.DataSourceSettings.DataSource = GetHierarchicalLayout();
model.DataSourceSettings.Parent = "ReportingPerson";
model.DataSourceSettings.Id = "Name";
model.Create = "create";
model.DefaultSettings.Node = new Node()
{
Constraints = NodeConstraints.Select | NodeConstraints.PointerEvents,
FillColor = "#88C65C",
Width = 115,
Height = 45,
BorderWidth = 1,
BorderColor = "black"
};
Label label = new Label()
{
FontColor = "white", FontSize = 12
};
model.DefaultSettings.Node.Labels.Add(label);
model.DefaultSettings.Connector = new Connector()
{
LineColor = "#000000",
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.Arrow
},
Constraints = ConnectorConstraints.None
};
model.SelectedItems.Constraints = ~SelectorConstraints.Rotator;
model.SelectionChange = "selectionChange";
model.SnapSettings.SnapConstraints = SnapConstraints.None;
model.EnableContextMenu = false;
model.Tool = Tool.SingleSelect;
model.NodeTemplate = "nodeTemplate";
ViewData["diagramModel"] = model;
return(View());
}
protected void Page_Load(object sender, EventArgs e)
{
DiagramWebControl1.PageSettings.ScrollLimit = ScrollLimit.Diagram;
DiagramWebControl1.Layout.Type = LayoutTypes.HierarchicalTree;
DiagramWebControl1.Layout.HorizontalSpacing = 25;
DiagramWebControl1.Layout.VerticalSpacing = 35;
DiagramWebControl1.Layout.Margin.Left = 0;
DiagramWebControl1.Layout.Margin.Top = 10;
DiagramWebControl1.DataSourceSettings.DataSource = GetHierarchicalLayout();
DiagramWebControl1.DataSourceSettings.Parent = "ReportingPerson";
DiagramWebControl1.DataSourceSettings.Id = "Name";
DiagramWebControl1.Model.DefaultSettings.Node = new Node()
{
Constraints = NodeConstraints.Select | NodeConstraints.PointerEvents,
FillColor = "#88C65C",
Width = 115,
Height = 45,
BorderWidth = 1,
BorderColor = "black",
};
Label label = new Label()
{
FontColor = "white", Margin = new LabelMargin()
{
Left = 10, Right = 10
}, FontSize = 12
};
DiagramWebControl1.Model.DefaultSettings.Node.Labels.Add(label);
DiagramWebControl1.Model.DefaultSettings.Connector = new Connector()
{
LineColor = "#000000",
Constraints = ConnectorConstraints.None,
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.Arrow
}
};
DiagramWebControl1.SelectedItems.Constraints = ~SelectorConstraints.Rotator;
DiagramWebControl1.Model.SelectionChange = "selectionChange";
DiagramWebControl1.SnapSettings.SnapConstraints = SnapConstraints.None;
DiagramWebControl1.EnableContextMenu = false;
DiagramWebControl1.Tool = Tool.SingleSelect;
DiagramWebControl1.NodeTemplate = "nodeTemplate";
}
//
// GET: /Organization/
public ActionResult BusinessChart()
{
DiagramProperties model = new DiagramProperties();
model.Width = "100%";
model.Height = "650px";
model.PageSettings.ScrollLimit = ScrollLimit.Diagram;
model.Layout.Type = LayoutTypes.OrganizationalChart;
model.Layout.HorizontalSpacing = 40;
model.Layout.VerticalSpacing = 40;
model.Layout.Margin.Top = 30;
model.Layout.GetLayoutInfo = "getLayoutInfo";
model.DataSourceSettings.DataSource = GetBusinessOrgChart();
model.DataSourceSettings.Parent = "Manager";
model.DataSourceSettings.Id = "Id";
model.DefaultSettings.Node = new Node()
{
Width = 150,
Height = 50,
BorderColor = "transparent"
};
Label label = new Label()
{
FontColor = "#ffffff", Margin = new LabelMargin()
{
Left = 5, Right = 5
}
};
model.DefaultSettings.Node.Labels.Add(label);
model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.None
}
};
model.SnapSettings.SnapConstraints = SnapConstraints.None;
model.EnableContextMenu = false;
model.Tool = Tool.ZoomPan;
model.NodeTemplate = "nodeTemplate";
ViewData["diagramModel"] = model;
return(View());
}
public FlowShape CreateNode(string name, FlowShapes shapeType, double width, double height, double offsetX, double offsetY, string text)
{
FlowShape node = new FlowShape();
node.Name = name;
node.Width = width;
node.Height = height;
node.OffsetX = offsetX;
node.OffsetY = offsetY;
node.Shape = shapeType;
node.Labels = new Collection();
Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label label = new Label();
label.Text = text;
node.Labels.Add(label);
return(node);
}
//
// GET: /Organization/
public ActionResult TeamOrgchart()
{
DiagramProperties model = new DiagramProperties();
model.Width = "100%";
model.Height = "600px";
model.PageSettings.ScrollLimit = ScrollLimit.Diagram;
model.Layout.Type = LayoutTypes.OrganizationalChart;
model.Layout.Margin.Top = 50;
model.Layout.HorizontalSpacing = 30;
model.Layout.VerticalSpacing = 30;
model.DataSourceSettings.DataSource = GetTeamChartData();
model.DataSourceSettings.Parent = "ReportingPerson";
model.DataSourceSettings.Id = "Id";
model.DefaultSettings.Node = new ImageNode()
{
Width = 140, Height = 50, BorderColor = "transparent", BorderWidth = 0
};
Label label = new Label()
{
Name = "name1", Text = "", HorizontalAlignment = HorizontalAlignment.Left, VerticalAlignment = VerticalAlignment.Top, FontSize = 11, Bold = true, FontFamily = "Segoe UI", Margin = new LabelMargin(-17, -17, 0, 0)
};
Label label1 = new Label()
{
Name = "name2", Text = "", HorizontalAlignment = HorizontalAlignment.Left, VerticalAlignment = VerticalAlignment.Top, FontSize = 10, FontFamily = "Segoe UI", Margin = new LabelMargin(-2, -17, 0, 0)
};
model.DefaultSettings.Node.Labels.Add(label);
model.DefaultSettings.Node.Labels.Add(label1);
model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.None
}
};
model.SnapSettings.SnapConstraints = SnapConstraints.None;
model.EnableContextMenu = false;
model.NodeTemplate = "nodeTemplate";
model.Tool = Tool.ZoomPan;
ViewData["diagramModel"] = model;
return(View());
}
protected void Page_Load(object sender, EventArgs e)
{
DiagramContent.Height = "500px";
DiagramContent.Width = "100%";
DiagramContent.PageSettings.ScrollLimit = ScrollLimit.Diagram;
DiagramContent.OnClientNodeCollectionChange = "nodecollectionchange";
DiagramContent.OnClientHistoryChange = "historyChange";
DiagramContent.HistoryManager.StackLimit = 3;
CreateFlowShape("node1", FlowShapes.Terminator, 90, 40, 380, 30, "#C44E5F", "Start", DiagramContent.Nodes);
CreateFlowShape("node2", FlowShapes.Process, 90, 40, 380, 100, "#5E5F5F", "Design?", DiagramContent.Nodes, true);
CreateFlowShape("node3", FlowShapes.Process, 90, 40, 380, 180, "#5E5F5F", "Coding", DiagramContent.Nodes, true);
CreateFlowShape("node4", FlowShapes.Process, 90, 40, 380, 260, "#5E5F5F", "Testing", DiagramContent.Nodes);
CreateFlowShape("node5", FlowShapes.Decision, 90, 40, 380, 340, "#4EAB8B", "Errors?", DiagramContent.Nodes);
CreateFlowShape("node6", FlowShapes.Terminator, 90, 40, 380, 450, "#C44E5F", "End", DiagramContent.Nodes);
CreateFlowShape("node7", FlowShapes.Decision, 120, 40, 200, 180, "#4EAB8B", "Design Errors?", DiagramContent.Nodes, true);
//Connect Shapes
ConnectHistoryShapes(DiagramContent.Model, "node1", "node2");
ConnectHistoryShapes(DiagramContent.Model, "node2", "node3");
ConnectHistoryShapes(DiagramContent.Model, "node3", "node4");
ConnectHistoryShapes(DiagramContent.Model, "node4", "node5");
//Label label = new Label() { Text = "No", FillColor = "white", Offset = new DiagramPoint(0.2f, 0.2f) };
ConnectHistoryShapes(DiagramContent.Model, "node5", "node6");
Label label1 = new Label()
{
Text = "Yes", FillColor = "white", Offset = new DiagramPoint(0.44f, 0.27f)
};
Connector connector = ConnectHistoryShapes(DiagramContent.Model, "node5", "node7", null, "inn");
connector.Labels.Add(label1);
Label label2 = new Label()
{
Text = "Yes", FillColor = "white", Offset = new DiagramPoint(0.44f, 0.27f)
};
connector = ConnectHistoryShapes(DiagramContent.Model, "node7", "node2", "in", null);
connector.Labels.Add(label2);
Label label3 = new Label()
{
Text = "No", FillColor = "white", Offset = new DiagramPoint(0.44f, 0.27f)
};
connector = ConnectHistoryShapes(DiagramContent.Model, "node7", "node3");
connector.Labels.Add(label3);
}
//
// GET: /Organization/
public ActionResult LocalDataBinding()
{
DiagramProperties model = new DiagramProperties();
model.Width = "100%";
model.Height = "490px";
model.PageSettings.ScrollLimit = ScrollLimit.Diagram;
model.Layout.Type = LayoutTypes.HierarchicalTree;
model.Layout.MarginY = 50;
model.Layout.HorizontalSpacing = 30;
model.Layout.VerticalSpacing = 40;
model.DataSourceSettings.DataSource = GetData();
model.DataSourceSettings.Parent = "TeamLead";
model.DataSourceSettings.Id = "Id";
model.DefaultSettings.Node = new Node()
{
Width = 110, Height = 40, BorderColor = "transparent"
};
Label label = new Label()
{
FontColor = "#ffffff", Margin = new LabelMargin()
{
Left = 5, Right = 5
}
};
model.DefaultSettings.Node.Labels.Add(label);
model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.Arrow
}
};
model.SnapSettings.SnapConstraints = SnapConstraints.None;
model.EnableContextMenu = false;
model.NodeTemplate = "nodeTemplate";
model.Tool = Tool.ZoomPan;
ViewData["diagramModel"] = model;
return(View());
}
private BasicShape CreateNode(String name, double width, double height, double offsetx, double offsety, string labelText)
{
BasicShape node = new BasicShape();
node.Name = name;
node.Width = width;
node.Height = height;
node.OffsetX = offsetx;
node.OffsetY = offsety;
node.FillColor = "#1BA0E2";
node.BorderColor = "#1BA0E2";
Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label label = new Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label();
label.Text = labelText;
label.FontColor = "white";
label.Name = name + "_label";
node.Labels.Add(label);
return(node);
}
private BasicShape CreateText(String name, double width, double height, double offsetx, double offsety, string labelText)
{
BasicShape node = new BasicShape();
node.Name = name;
node.Width = width;
node.Height = height;
node.OffsetX = offsetx;
node.OffsetY = offsety;
node.FillColor = "transparent";
node.BorderWidth = 1;
node.BorderColor = "transparent";
node.Constraints = NodeConstraints.Default & ~NodeConstraints.Select;
Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label label = new Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label();
label.Text = labelText;
label.Name = name + "_label";
node.Labels.Add(label);
return(node);
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
DiagramWebControl1.Model.Width = "100%";
DiagramWebControl1.Model.Height = "490px";
DiagramWebControl1.Model.Layout.Type = LayoutTypes.HierarchicalTree;
DiagramWebControl1.Model.Layout.Margin.Top = 50;
DiagramWebControl1.Model.Layout.HorizontalSpacing = 60;
DiagramWebControl1.Model.Layout.VerticalSpacing = 50;
Label label = new Label();
label.Name = "label1";
label.FontColor = "white";
label.Offset = new DiagramPoint(0.5f, 0.3f);
Label label1 = new Label();
label1.Name = "label2";
label1.FontColor = "white";
label1.Offset = new DiagramPoint(0.5f, 0.6f);
Node node = new Node();
node.Width = 140;
node.Height = 50;
node.FillColor = "darkCyan";
node.BorderColor = "#3F3F3F";
node.BorderWidth = 1;
node.Labels = new Collection();
node.Labels.Add(label);
node.Labels.Add(label1);
DiagramWebControl1.Model.DefaultSettings.Node = node;
DiagramWebControl1.Model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
}
};
DiagramWebControl1.Model.SnapSettings.SnapConstraints = SnapConstraints.None;
DiagramWebControl1.Model.EnableContextMenu = false;
}
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
ProjectChart.Model.DataSourceSettings.DataSource = GetProjectChartData();
ProjectChart.Model.DataSourceSettings.Parent = "Phase";
ProjectChart.Model.DataSourceSettings.Id = "Id";
Dictionary <string, object> addInfo = new Dictionary <string, object>();
addInfo.Add("orientation", "vertical");
addInfo.Add("type", "alternate");
ProjectChart.Model.DefaultSettings.Node = new Node()
{
Constraints = NodeConstraints.Select | NodeConstraints.PointerEvents,
Width = 110,
Height = 40,
BorderColor = "black",
AddInfo = addInfo
};
Label label = new Label()
{
FontColor = "#ffffff"
};
ProjectChart.Model.DefaultSettings.Node.Labels.Add(label);
ProjectChart.Model.DefaultSettings.Connector = new Connector()
{
LineColor = "#000000",
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.None
}
};
ProjectChart.Model.SelectedItems.Constraints &= ~SelectorConstraints.Rotator;
ProjectChart.Model.NodeTemplate = "nodeTemplate";
ProjectChart.Model.SelectionChange = "selectionChange";
}
}
private BPMNNode CreateBPMNShape(Collection nodes, String name, BPMNShapes shape, double width, double height, double offsetx, double offsety, string text = "", string description = "")
{
BPMNNode node = new BPMNNode();
node.Name = name;
node.Shape = shape;
node.Width = width;
node.Height = height;
node.OffsetX = offsetx - 60;
node.OffsetY = offsety;
Label label = new Label();
label.Text = text;
label.FontColor = "black";
if (shape == BPMNShapes.Event && text != "")
{
label.Offset = new DiagramPoint()
{
Y = 1
};
label.VerticalAlignment = VerticalAlignment.Top;
}
else
{
label.Offset = new DiagramPoint()
{
Y = 0.5f
};
}
node.Labels.Add(label);
if (description != "")
{
node.AddInfo = new Dictionary <string, object> {
{ "Description", description }
}
}
;
nodes.Add(node);
return(node);
}
private void ConnectNode(DiagramProperties model, string name, Node targetNode, Node sourceNode, string labelText, bool hasLabel, string sourcePort, string targetPort)
{
Connector connector = new Connector();
connector.Name = name;
connector.TargetNode = targetNode.Name;
connector.SourceNode = sourceNode.Name;
connector.LineWidth = 2;
if (name == "connector6")
{
Segment seg = new Segment();
seg.Length = 50;
seg.Direction = "right";
seg.Type = Segments.Orthogonal;
connector.Segments.Add(seg);
seg = new Segment();
seg.Type = Segments.Orthogonal;
connector.Segments.Add(seg);
}
if (hasLabel)
{
Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label label = new Syncfusion.JavaScript.DataVisualization.Models.Diagram.Label();
label.FontColor = "black";
label.FillColor = "white";
label.Text = labelText;
connector.Labels.Add(label);
}
connector.SourceDecorator.Shape = Syncfusion.JavaScript.DataVisualization.DiagramEnums.DecoratorShapes.Arrow;
connector.TargetDecorator.Shape = Syncfusion.JavaScript.DataVisualization.DiagramEnums.DecoratorShapes.None;
connector.TargetDecorator.BorderColor = "#606060";
connector.TargetDecorator.Width = 10;
connector.TargetDecorator.Height = 10;
connector.SourcePort = targetPort;
connector.TargetPort = sourcePort;
model.Connectors.Add(connector);
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
TeamChart.Model.DataSourceSettings.DataSource = GetOrgChartData();
TeamChart.Model.DataSourceSettings.Parent = "ReportingPerson";
TeamChart.Model.DataSourceSettings.Id = "Id";
TeamChart.Model.DefaultSettings.Node = new ImageNode()
{
Width = 140, Height = 50, BorderColor = "transparent", BorderWidth = 0
};
Label label = new Label()
{
Name = "label1", Text = "", HorizontalAlignment = HorizontalAlignment.Left, VerticalAlignment = VerticalAlignment.Top, FontSize = 11, Bold = true, FontFamily = "Segoe UI", Margin = new LabelMargin(-17, -17, 0, 0)
};
Label label1 = new Label()
{
Name = "label2", Text = "", HorizontalAlignment = HorizontalAlignment.Left, VerticalAlignment = VerticalAlignment.Top, FontSize = 10, FontFamily = "Segoe UI", Margin = new LabelMargin(-2, -17, 0, 0)
};
TeamChart.Model.DefaultSettings.Node.Labels.Add(label);
TeamChart.Model.DefaultSettings.Node.Labels.Add(label1);
TeamChart.Model.DefaultSettings.Connector = new Connector()
{
Segments = new Collection()
{
new Segment(Segments.Orthogonal)
},
TargetDecorator = new Decorator()
{
Shape = DecoratorShapes.None
},
Constraints = ConnectorConstraints.None
};
TeamChart.Model.NodeTemplate = "nodeTemplate";
}
}
protected void Page_Load(object sender, EventArgs e)
{
DiagramWebControl1.Height = "550px";
DiagramWebControl1.PageSettings.ScrollLimit = ScrollLimit.Diagram;
DiagramWebControl1.SnapSettings.SnapConstraints = SnapConstraints.None;
DiagramWebControl1.OnClientSelectionChange = "selectionchanged";
//Initialize shapes
CreateFlowShape("node1", FlowShapes.Terminator, 90, 40, 80, 90, "Start", DiagramWebControl1.Nodes);
CreateFlowShape("node2", FlowShapes.Decision, 130, 100, 260, 90, "Already installed the software?", DiagramWebControl1.Nodes);
CreateFlowShape("node3", FlowShapes.Process, 100, 50, 440, 90, "Show license agreement", DiagramWebControl1.Nodes);
CreateFlowShape("node4", FlowShapes.Decision, 90, 80, 620, 90, "Agreed?", DiagramWebControl1.Nodes);
CreateFlowShape("node5", FlowShapes.Decision, 130, 90, 260, 240, "Can override the existing version?", DiagramWebControl1.Nodes);
CreateFlowShape("node6", FlowShapes.Process, 90, 50, 620, 240, "Select destination folder", DiagramWebControl1.Nodes);
CreateFlowShape("node7", FlowShapes.Decision, 110, 100, 620, 410, "Enough disk space?", DiagramWebControl1.Nodes);
CreateFlowShape("node8", FlowShapes.Process, 90, 50, 440, 410, "Free Space", DiagramWebControl1.Nodes);
FlowShape target = CreateFlowShape("node9", FlowShapes.Process, 90, 50, 260, 410, "Copy files", DiagramWebControl1.Nodes, true);
CreateFlowShape("node10", FlowShapes.Terminator, 90, 40, 80, 410, "End", DiagramWebControl1.Nodes);
//Connect Shapes
ConnectNode(DiagramWebControl1.Connectors, "node1", "node2");
ConnectNode(DiagramWebControl1.Connectors, "node2", "node3", null, new Label()
{
Text = "No"
});
ConnectNode(DiagramWebControl1.Connectors, "node3", "node4");
Collection segments = new Collection()
{
new Segment()
{
Type = Segments.Orthogonal, Length = 30, Direction = "right"
},
new Segment()
{
Type = Segments.Orthogonal, Length = 80, Direction = "bottom"
},
new Segment()
{
Type = Segments.Orthogonal, Length = 620, Direction = "left"
},
new Segment()
{
Type = Segments.Orthogonal, Length = 220, Direction = "bottom"
}
};
Label label = new Label()
{
Text = "No", FillColor = "white", Offset = new DiagramPoint(0.44f, 0.27f)
};
ConnectNode(DiagramWebControl1.Connectors, "node4", "node10", segments, label);
label = new Label()
{
Text = "Yes", FillColor = "white", Offset = new DiagramPoint(0.2f, 0.2f)
};
ConnectNode(DiagramWebControl1.Connectors, "node2", "node5", null, label);
label = new Label()
{
Text = "Yes", FillColor = "white", Offset = new DiagramPoint(0.2f, 0.2f)
};
ConnectNode(DiagramWebControl1.Connectors, "node4", "node6", null, label);
ConnectNode(DiagramWebControl1.Connectors, "node6", "node7");
ConnectNode(DiagramWebControl1.Connectors, "node7", "node8", null, new Label()
{
Text = "No"
});
Label label4 = new Label()
{
Text = "No", FillColor = "white"
};
ConnectNode(DiagramWebControl1.Connectors, "node8", "node9");
ConnectNode(DiagramWebControl1.Connectors, "node9", "node10");
segments = new Collection()
{
new Segment()
{
Type = Segments.Orthogonal, Length = 20, Direction = "left"
},
new Segment()
{
Type = Segments.Orthogonal, Length = 72, Direction = "bottom"
},
new Segment()
{
Type = Segments.Orthogonal, Length = 20, Direction = "right"
}
};
label = new Label()
{
Text = "Yes", FillColor = "white", Offset = new DiagramPoint(0.01f, 0.38f)
};
ConnectNode(DiagramWebControl1.Connectors, "node5", "node9", segments, label, (target.Ports[0] as Port).Name);
segments = new Collection()
{
new Segment()
{
Type = Segments.Orthogonal, Length = 20, Direction = "right"
},
new Segment()
{
Type = Segments.Orthogonal, Length = 97, Direction = "top"
},
new Segment()
{
Type = Segments.Orthogonal, Length = 426, Direction = "left"
}
};
label = new Label()
{
Text = "Yes", FillColor = "white", Offset = new DiagramPoint(0.22f, 0.01f)
};
ConnectNode(DiagramWebControl1.Connectors, "node7", "node9", segments, label, (target.Ports[1] as Port).Name);
}
private void ConnectNode(Collection nodes, string sourceNode, string targetNode, Collection segments = null, Label label = null, string targetPort = "")
{
Connector connector = new Connector();
connector.Name = "line" + DiagramWebControl1.Connectors.Count + 1;
connector.TargetNode = targetNode;
connector.SourceNode = sourceNode;
connector.TargetPort = targetPort;
connector.CornerRadius = 10;
connector.LineWidth = 2;
connector.Constraints = ConnectorConstraints.Default | ConnectorConstraints.Bridging;
if (segments == null)
{
segments = new Collection()
{
new Segment()
{
Type = Segments.Orthogonal
}
}
}
;
connector.Segments = segments;
connector.AddInfo = new Dictionary <string, object> {
{ "segments", segments }
};
if (label != null)
{
label.FillColor = "white";
connector.Labels = new Collection()
{
label
};
}
DiagramWebControl1.Connectors.Add(connector);
}
}
private void ConnNode(Collection nodes, string sourceNode, string targetNode, Collection segments = null, Label label = null)
{
Connector connector = new Connector();
connector.TargetNode = targetNode;
connector.SourceNode = sourceNode;
if (label != null)
{
label.FillColor = "white";
connector.Labels = new Collection()
{
label
};
}
if (segments == null)
{
segments = new Collection()
{
new Segment()
{
Type = Segments.Orthogonal
}
}
}
;
connector.Segments = segments;
DiagramContent.Connectors.Add(connector);
}
}
