記得之前做項(xiàng)目的時(shí)候客戶需要看一個(gè)組織結(jié)構(gòu)圖,從而了解一下公司的概況,本來自己之前沒有做過這方面的控件,只好找度娘,出于對項(xiàng)目的完美,網(wǎng)上很多控件畫面感比較渣,后來只能在這些個(gè)中挑個(gè)比較好的來做,先看圖:
第一個(gè):

出自:http://philogb.github.io/jit/demos.html 可以去看看。
第二個(gè):

這個(gè)控件的出處我記不清了,至于喜歡哪款,那就仁者見仁智者見智了。
第一款技術(shù)實(shí)現(xiàn) 看這 :http://philogb.github.io/jit/demos.html
第二款技術(shù)實(shí)現(xiàn):http://files.VEVb.com/files/houlin/Org.zip 源碼
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="asp_Demo.aspx.cs" Inherits="OrgCharts_asp_Demo" %><%@ Register Assembly="BPOrgDiagram" Namespace="Basicxmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <script type="text/javascript" src="../Scripts/jquery-1.9.1.js"></script> <script type="text/Javascript" src="../Scripts/jquery-ui-1.10.2.custom.min.js"></script> <script type="text/javascript" src="../Scripts/json3.min.js"></script> <link rel="stylesheet" type="text/CSS" href="../Scripts/ui-lightness/jquery-ui-1.10.2.custom.min.css" /> <link href="../Scripts/primitives.latest.css" rel="stylesheet" /> <script type="text/javascript" src="../Scripts/primitives.min.js?204"></script> <style type="text/css"> #Form { width: 100%; } </style></head><body> <form id="Form" runat="server"> <asp:ScriptManager ID="ScriptManager" runat="server"> </asp:ScriptManager> <div style="width: 100%; float: left;"> <cc1:OrgDiagramServerControl ID="orgDiagram" runat="server" BorderColor="White" BorderStyle="Solid" BorderWidth="1px" Width="100%" Style="margin-right: 0px; top: 48px; left: 11px; height: 800px;" OnItemCheckChanged="orgDiagram_ItemCheckChanged" OnSelectedItemChanged="orgDiagram_SelectedItemChanged" Height="700px" MaximumColumnsInMatrix="8" DotItemsInterval="10" DotLevelShift="10" ChildrenPlacementType="Horizontal" OnTemplateButtonClick="orgDiagram_TemplateButtonClick"> <Buttons> <cc1:Button Name="展開" /> <%--<cc1:Button Icon="Locked" Name="Locked" />--%> <cc1:Button Icon="Print" Name="以此為父節(jié)點(diǎn)導(dǎo)出Excel" /> </Buttons> </cc1:OrgDiagramServerControl> </div> </form> <script type="text/javascript" src="../Scripts/UserTemplates.js?1029"></script></body></html>
后臺(tái)實(shí)現(xiàn):
using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI;using System.Web.UI.WebControls;using BasicPrimitives.OrgDiagram;using System.Drawing;using BasicPrimitivesDemo;using System.Data;using CAF.DBUtility;using Microsoft.Office.Interop.Excel;public partial class OrgCharts_asp_Demo : System.Web.UI.Page{ protected void Page_Load(object sender, EventArgs e) { // only bind the data on the first page load...只有綁定第一頁上的數(shù)據(jù)加載… if (!Page.IsPostBack) { GetData(); } } protected void orgDiagram_SelectedItemChanged(object sender, EventArgs e) { Item selectedItem = this.orgDiagram.SelectedItem; } protected void orgDiagram_ItemCheckChanged(object sender, EventArgs e) { Items checkedItems = this.orgDiagram.CheckedItems; } /// <summary> /// 點(diǎn)擊框邊的按鈕觸發(fā)的事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> protected void orgDiagram_TemplateButtonClick(object sender, TemplateButtonClickEventArgs e) { String buttonName = e.ButtonName;//三按鈕的名稱 Item clickedButtonItem = e.Item; string p_id = clickedButtonItem.Value; if (buttonName == "以此為父節(jié)點(diǎn)導(dǎo)出EXCEL") { //Excel_Out(p_id); //SetRangeBackground(4, 2, 6, 4, 003366); } else if (buttonName == "展開" && p_id != "01") { AddOrg(clickedButtonItem, clickedButtonItem.Value); } } /// <summary> /// 獲取Data /// </summary> private void GetData() { this.orgDiagram.Items.Clear(); DataSet ds = CAF.DBUtility.SqlHelper.ExecuteDataSet(" ");//數(shù)據(jù)源this.ViewState["ds"] = ds; /* Root */ Item MarkKornegay = new Item("集團(tuán)", "01", "GM Group", "../images/photos/a.png"); MarkKornegay.TemplateName = "UserTemplateContact"; MarkKornegay.TitleColor = Color.CornflowerBlue; //MarkKornegay.GroupTitle = "Group"; //MarkKornegay.GroupTitleColor = Color.Blue; MarkKornegay.ShowCheckBox = BasicPrimitives.OrgDiagram.Enabled.False; MarkKornegay.ShowButtons = BasicPrimitives.OrgDiagram.Enabled.True; this.orgDiagram.Items.Add(MarkKornegay); AddOrg(MarkKornegay, "01"); } /// <summary> /// 追加節(jié)點(diǎn) /// </summary> /// <param name="P_Org_Item"></param> /// <param name="int_parent_id"></param> public void AddOrg(Item P_Org_Item, string int_parent_id) { string id = ""; string name = ""; string parent_org_id = ""; string org_type = ""; DataSet ds = (DataSet)this.ViewState["ds"]; DataRow[] dr = ds.Tables[0].Select(" parent_org_id = '" + int_parent_id + "' "); foreach (DataRow dr1 in dr) { id = dr1["id"].ToString(); name = dr1["name"].ToString(); parent_org_id = dr1["parent_org_id"].ToString(); org_type = dr1["org_type"].ToString(); Item demo_item = new Item(name, id, "test", "../images/photos/a.png"); if (id.Length != 11) { demo_item.TemplateName = "UserTemplateContact"; } demo_item.TitleColor = Color.CornflowerBlue; //demo_item.GroupTitle = "Group"; //demo_item.GroupTitleColor = Color.Orange; demo_item.ShowCheckBox = BasicPrimitives.OrgDiagram.Enabled.False; demo_item.ShowButtons = BasicPrimitives.OrgDiagram.Enabled.True; P_Org_Item.Items.Add(demo_item); //AddOrg(demo_item, id); } }} 新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注