Introduction
I am going to show how to design your Organograms with a organograms control using database.
Background
i am shibashish mohanty using my little effort to show you a basic diagram .if you have any better solution please call me in this no 09853205712?
Using the code
Here is my source code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SwashOrganoGraph.aspx.cs" Inherits="SwashOrganoGraph" %>
<%@ Register Assembly="UnifoChart.Hierarchy.Web.Free" Namespace="UnifoChart.Hierarchy" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="width:100%">
<head id="Head1" runat="server">
<style id="Style1" runat="server">
p:first-letter
{
color: #ff0000;
font-size:xx-large
}
ul li{
color:orange;
}
dl dt{
color:orange;
font-weight:bold;
text-indent:40px;
}
.toppic {
border:0;
}
</style>
</head>
<body>
<div style="background: #FFFFFF url(/image/header_bg_line.gif) repeat-x 0pt; padding:0px">
<br /><h2>Om Namah shivaya</h2>
</div>
<form id="form1" runat="server">
<div class="container">
<a id="idChart"></a>
<cc1:HierarchyWeb ID="HierarchyWeb1" runat="server" Height="445px"
Style="z-index: 101; position: relative;" Text="MK" Width="606px" OnInit="HierarchyWeb1_Init" OnheHierarchyDraw="HierarchyWeb1_heHierarchyDraw" OnheHierarchyData="HierarchyWeb1_heHierarchyData"/>
</div>
<br />
<br />
<br />
<br />
<br />
Change Your Graph Shapes:-<asp:DropDownList ID="ddlChartStyle" runat="server">
<asp:ListItem>Normal</asp:ListItem>
<asp:ListItem>ThreeD</asp:ListItem>
<asp:ListItem>Shaded</asp:ListItem>
</asp:DropDownList>
<br />
<br />
Change Your Graph Direction:-<asp:DropDownList ID="ddlChartOrientation"
runat="server">
<asp:ListItem>TopToBottom</asp:ListItem>
<asp:ListItem>LeftToRight</asp:ListItem>
<asp:ListItem>BottomToTop</asp:ListItem>
<asp:ListItem>RightToLeft</asp:ListItem>
</asp:DropDownList>
<br />
<br />
ChartLayout:-<asp:DropDownList ID="ddlChartLayout" runat="server">
<asp:ListItem>FlexiDraw</asp:ListItem>
<asp:ListItem>DirectDraw</asp:ListItem>
<asp:ListItem>FlexiExtended</asp:ListItem>
</asp:DropDownList>
<br />
<br />
<asp:Button ID="Button1" runat="server" onclick="Button1_Click"
Text="Apply Settings" />
</form>
</body>
</html>
my code behind is here:-
using System;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using UnifoChart.Hierarchy;
public partial class SwashOrganoGraph : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void HierarchyWeb1_Init(object sender, EventArgs e)
{
HierarchyWeb1.hpShowTitleBar = true;
HierarchyWeb1.hpLoadingHtml = "<img src='http://www.codeproject.com/image/hierarchy-chart/loading.gif'/>";
HierarchyWeb1.hpShowContextMenu = true;
HierarchyWeb1.hpcSettings.Chart_Layout = UnifoChart.Hierarchy.ChartLayoutType.FlexiExtended;
HierarchyWeb1.hpShowToolTip = true;
HierarchyWeb1.hpShowToolTipNode = true;
HierarchyWeb1.hpcSettings.ShowFocus = false;
}
protected void HierarchyWeb1_heHierarchyData(object sender, EventArgs e)
{
HierarchyWeb1.hpcData.PhotoSpecification = PhotoSpecificationType.ByFileName;
HierarchyWeb1.hpcData.PhotoPath = "/photo/";
HierarchyWeb1.hpcSettings.Photo_ImageList4Nodes.ImageSize = new System.Drawing.Size(64, 64);
HierarchyWeb1.hpcSettings.Node_IsSpaceNewLine = false;
HierarchyWeb1.hpcSettings.Node_IsDataHasText = true;
string connection = ConfigurationManager.ConnectionStrings["TestConnectionString"].ConnectionString;
SqlConnection con = new SqlConnection(connection);
SqlDataAdapter da = new SqlDataAdapter("select id,pid,txt,duty,value,tooltip,imagefile,category from OrganoGraph", con);
DataSet ds = new DataSet();
DataTable dt1 = new DataTable();
da.Fill(dt1);
string sResult = HierarchyWeb1.hpcData.LoadFromDataTable(ref dt1);
if (sResult != "")
{
Response.Write(sResult);
return;
}
HierarchyWeb1.hpcData.ExpandAll();
}
//Testing some code below
protected void HierarchyWeb1_heHierarchyDraw(object sender, EventArgs e)
{
//Apply Effects/Settings
this.ApplySettings();
//node-click behavior (default is inactive)
HierarchyWeb1.hpDrillDownMode = DrillDownModeType.NavigateNode;//navigate to a parametrized page
HierarchyWeb1.hpDrillDownTarget = "_blank";//in new window
HierarchyWeb1.hpDrillDownURL = "/details.aspx";//the parametrized page
HierarchyWeb1.hpTitleText = "Organization Chart";
//custom settings for 'Executive' nodes
HierarchyNode hnd1 = HierarchyWeb1.hpcData.Tags["Executive"];//get reference
hnd1.BackgroundType = BackgroundType.Stock;
hnd1.BackgroundStock = BackgroundTemplate.GreenWall;
hnd1.BackgroundBrush4Tag.BrushType = BrushType.HatchStyleBrush;
hnd1.BackgroundBrush4Tag.HatchStyle = HatchStyleType.NarrowVertical;
hnd1.BackgroundBrush4Tag.Color2 = System.Drawing.Color.ForestGreen;
//custom settings for 'Manager' nodes
hnd1 = HierarchyWeb1.hpcData.Tags["Manager"];//get reference
hnd1.BackgroundType = BackgroundType.Stock;
hnd1.BackgroundStock = BackgroundTemplate.BlueFlowers;
hnd1.BackgroundBrush4Tag.BrushType = BrushType.LinearGradientBrush;
hnd1.BackgroundBrush4Tag.Color1 = System.Drawing.Color.Brown;
hnd1.BackgroundBrush4Tag.Color2 = System.Drawing.Color.CadetBlue;
}
//Apply settings selected in page's dropdown boxes.
private void ApplySettings()
{
//ddlChartStyle
switch (ddlChartStyle.SelectedIndex)
{
case 0://Normal
HierarchyWeb1.hpcSettings.Chart_Style = ChartStyleType.Normal;
break;
case 1://ThreeD
HierarchyWeb1.hpcSettings.Chart_Style = ChartStyleType.ThreeD;
break;
case 2://Shaded
HierarchyWeb1.hpcSettings.Chart_Style = ChartStyleType.Shaded;
break;
}
//ddlChartOrientation
switch (ddlChartOrientation.SelectedIndex)
{
case 0://TopToBottom
HierarchyWeb1.hpcSettings.Chart_Orientation = OrientationType.TopToBottom;
break;
case 1://LeftToRight
HierarchyWeb1.hpcSettings.Chart_Orientation = OrientationType.LeftToRight;
break;
case 2://BottomToTop
HierarchyWeb1.hpcSettings.Chart_Orientation = OrientationType.BottomToTop;
break;
case 3://RightToLeft
HierarchyWeb1.hpcSettings.Chart_Orientation = OrientationType.RightToLeft;
break;
}
//ddlChartLayout
switch (ddlChartLayout.SelectedIndex)
{
case 0://FlexiDraw
HierarchyWeb1.hpcSettings.Chart_Layout = ChartLayoutType.FlexiDraw;
break;
case 1://DirectDraw
HierarchyWeb1.hpcSettings.Chart_Layout = ChartLayoutType.DirectDraw;
break;
case 2://FlexiExtended
HierarchyWeb1.hpcSettings.Chart_Layout = ChartLayoutType.FlexiExtended;
break;
}
}
protected void Button1_Click(object sender, EventArgs e)
{
this.ApplySettings();
}
}
<div>My data base design like this:-
Table Name:OrganoGraph
id int Checked
pid int Checked
txt varchar(50) Checked
duty varchar(50) Checked
value varchar(50) Checked
tooltip varchar(50) Checked
imagefile varchar(50) Checked
category varchar(50) Checked
Value:-
| 1 | 0 | Pritam Pal\nCEO | NULL | NULL | joyce.png | NULL | CEO |
| 2 | 1 | Jyoti Prakash Mahapatra\nProject Manager | NULL | NULL | shibashish.jpg | NULL | Project Manager |
| 3 | 2 | Prajanuranjan Moharana\nTeam Lead | NULL | NULL | palm.png | NULL | Team Lead |
| 4 | 2 | Shibasish Mohanty\nTeam Lead | NULL | NULL | shibashish.jpg | NULL | Team Lead |
| 5 | 3 | Priti Ranjan Dash\nDeveloper | NULL | NULL | kendra.png | NULL | Developer |
| 6 | 3 | Shivsankar Mohapatra\nDeveloper | NULL | NULL | shibashish.jpg | NULL | Developer |
| 7 | 4 | Manoj Sethi\nDeveloper | NULL | NULL | mike1.png | NULL | Jr. Developer |
| 8 | 9 | Subhadip Sarangi\nDeveloper | NULL | NULL | meg.png | NULL | Jr. Developer |
| 9 | 2 | Biswa\nTeam Leader | NULL | NULL | shibashish.jpg | NULL | Team Leader |
If you are feeling that i am able to solve your problem then contact me any time.I am happy to solve your problem.
After running it will looks like
Thanks shibashish mohanty
You can download this from My Code project article also
Click here to DOWNLOAD
if you are unable to find dll or if you need the entire application in zip or in rar file,then please mention your email Id here.And if possible call me for quick response.Thanks for viewing my page.
ReplyDelete
ReplyDeletePlease send me entire app in rar file to bwarsi@gmail.com
Thanks