多个parant子层次结构。 [英] Multiple parant child hierarchy.
本文介绍了多个parant子层次结构。的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
1）我有一个名为供应链的表，其中客户的数据如卖家和买家关系
2）我想显示这些多元关系像组织结构图这样的图表。
我尝试了什么：
Html
< script type = text / javascript src = http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js > < / script >
< script 类型 = text / javascript src = https：/ /www.google.com/jsapi\"> < / script >
< script 类型 = text / javascript > ;
google.load（ visu alization， 1，{packages：[ orgchart]}）;
google.setOnLoadCallback（drawChart）;
function drawChart（）{
$ .ajax（{
type： POST，
url： CS.aspx / GetChartData，
数据：' {}' ，
contentType： application / json; charset = utf-8，
dataType： json，
成功：功能（r）{
var data = new google.visualization。 DataTable（）;
data.addColumn（' string'，' 实体'）;
data.addColumn（' string'， ' ParentEntity'）;
data.addColumn（' string'， ' ToolTip'）;
for （ var i = 0 ; i< rdlength; i ++）
{
// var employeeId = rd [i] [0] .toString（）;
// var employeeName = rd [i] [1];
// var designation = rd [i ] [2];
// var reportingManager = rd [i] [3]！ = null？ rd [i] [3] .toString（）：'';
// data .addRows
var employeeId = rd [i] [ 0 ]。toString （）;
var employeeName = rd [i] [ 1 ]
var names = rd [i] [ 2 ];
var reportingManager = r.d [i] [ 3 ];
var reportingManager = rd [i] [ 3 ]！= null ？ rd [i] [ 3 ]。toString（）：' ;
data.addRows
（[[{
f：employeeName，
v：employeeId，
// < span class =code-comment> +'< div>（< span>'+ names +'< / span>）< / div>< img src =Pictures /'+ employeeId +'。 jpg/>'
}，reportingManager，designation]]）;
}
var chart = new google.visualization.OrgChart（$（< span class =code-string> ＃chart）[ 0 ]） ;
chart.draw（data，{allowHtml： true }）;
}，
失败： function （r）{
alert（r.d）;
}，
错误： function （r）{
alert（r.d）;
}
}）;
}
< / 脚本 >
cs code
使用系统;
使用 System.Collections.Generic;
使用 System.Linq;
使用 System.Web;
使用 System.Web.UI;
使用 System.Web.UI.WebControls;
使用 System.Data;
使用 System.Web.Services;
使用 System.Configuration;
使用 System.Data.SqlClient;
使用 SPM.BLL;
使用 DevExpress.Web;
命名空间 SPM
{
public partial class CS：System.Web.UI.Page
{
public static string TypeID，ID;
[WebMethod]
public static List< ;对象> GetChartData（）
{
string query = SELECT SupplyChain.SellerID，SupplyChain.BuyerID，ViewAllCustomerForSpplyChain_1.CompanyName AS SELLERNAME，ViewAllCustomerForSpplyChain.CompanyName AS BUYERNAME FROM供应链INNER JOIN ViewAllCustomerForSpplyChain AS ViewAllCustomerForSpplyChain_1 ON SupplyChain.MasterID = ViewAllCustomerForSpplyChain_1.ID AND SupplyChain.MasterTypeID = ViewAllCustomerForSpplyChain_1.TypeID INNER JOIN ViewAllCustomerForSpplyChain ON SupplyChain.ChildID = ViewAllCustomerForSpplyChain.ID AND SupplyChain.ChildTypeID = ViewAllCustomerForSpplyChain.TypeID WHERE（SupplyChain.DeleteStatus = 0）;
// query + =FROM EmployeeHierarchy;
string constr = ConfigurationManager.ConnectionStrings [ ConStr]。的ConnectionString;
使用（SqlConnection con = new SqlConnection（constr））
{
使用（SqlCommand cmd = new SqlCommand（query））
{
列表与LT;对象> chartData = new List< object>（）;
cmd.CommandType = CommandType.Text;
cmd.Connection = con;
con.Open（）;
使用（SqlDataReader sdr = cmd.ExecuteReader（））
{
while （sdr.Read（））
{
chartData.Add（ new object []
{
sdr [ SellerID]，sdr [ SellerName]，sdr [ BuyerName]，sdr [ BuyerID]
}）;
}
}
con.Close（）;
return chartData;
}
}
}
}
}
解决方案
.ajax（{
type： POST，
url ： CS.aspx / GetChartData，
data：' {}'，
contentType： application / json; charset = utf-8，
dataType： json，
成功： function （r）{
var data = new google.visualization.DataTable（）;
data.addColumn（' string'，' 实体'）;
data.addColumn（' string'， ' ParentEntity'）;
data.addColumn（' string'， ' ToolTip'）;
for （ var i = 0 ; i< rdlength; i ++）
{
// var employeeId = rd [i] [0] .toString（）;
// var employeeName = rd [i] [1];
// var designation = rd [i ] [2];
// var reportingManager = rd [i] [3]！ = null？ rd [i] [3] .toString（）：'';
// data .addRows
var employeeId = rd [i] [ 0 ]。toString （）;
var employeeName = rd [i] [ 1 ]
var names = rd [i] [ 2 ];
var reportingManager = r.d [i] [ 3 ];
var reportingManager = rd [i] [ 3 ]！= null ？ rd [i] [ 3 ]。toString（）：' ;
data.addRows
（[[{
f：employeeName，
v：employeeId，
// < span class =code-comment> +'< div>（< span>'+ names +'< / span>）< / div>< img src =Pictures /'+ employeeId +'。 jpg/>'
}，reportingManager，designation]]）;
}
var chart = new google.visualization.OrgChart（
（ ＃chart）[ 0 ]）;
chart.draw（data，{allowHtml： true }）;
}，
失败： function （r）{
alert（r.d）;
}，
错误： function （r）{
alert（r.d）;
}
}）;
}
< / 脚本 >
cs code
使用系统;
使用 System.Collections.Generic;
使用 System.Linq;
使用 System.Web;
使用 System.Web.UI;
使用 System.Web.UI.WebControls;
使用 System.Data;
使用 System.Web.Services;
使用 System.Configuration;
使用 System.Data.SqlClient;
使用 SPM.BLL;
使用 DevExpress.Web;
命名空间 SPM
{
public partial class CS：System.Web.UI.Page
{
public static string TypeID，ID;
[WebMethod]
public static List< ;对象> GetChartData（）
{
string query = SELECT SupplyChain.SellerID，SupplyChain.BuyerID，ViewAllCustomerForSpplyChain_1.CompanyName AS SELLERNAME，ViewAllCustomerForSpplyChain.CompanyName AS BUYERNAME FROM供应链INNER JOIN ViewAllCustomerForSpplyChain AS ViewAllCustomerForSpplyChain_1 ON SupplyChain.MasterID = ViewAllCustomerForSpplyChain_1.ID AND SupplyChain.MasterTypeID = ViewAllCustomerForSpplyChain_1.TypeID INNER JOIN ViewAllCustomerForSpplyChain ON SupplyChain.ChildID = ViewAllCustomerForSpplyChain.ID AND SupplyChain.ChildTypeID = ViewAllCustomerForSpplyChain.TypeID WHERE（SupplyChain.DeleteStatus = 0）;
// query + =FROM EmployeeHierarchy;
string constr = ConfigurationManager.ConnectionStrings [ ConStr]。的ConnectionString;
使用（SqlConnection con = new SqlConnection（constr））
{
使用（SqlCommand cmd = new SqlCommand（query））
{
列表与LT;对象> chartData = new List< object>（）;
cmd.CommandType = CommandType.Text;
cmd.Connection = con;
con.Open（）;
使用（SqlDataReader sdr = cmd.ExecuteReader（））
{
while （sdr.Read（））
{
chartData.Add（ new object []
{
sdr [ SellerID]，sdr [ SellerName]，sdr [ BuyerName]，sdr [ BuyerID]
}）;
}
}
con.Close（）;
return chartData;
}
}
}
}
}
我是强烈建议阅读：第5部分：从树木到图形 [ ^ ]和这：演练：在TreeView控件中显示分层数据 [ ^ ]
1) i have table named "supply chain" in which data of customers like sellers and buyers relationship
2) i want to display these multiple relation ship into a chart like "Organizational chart".
What I have tried:
Html
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1", { packages: ["orgchart"] });
google.setOnLoadCallback(drawChart);
function drawChart() {
$.ajax({
type: "POST",
url: "CS.aspx/GetChartData",
data: '{}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Entity');
data.addColumn('string', 'ParentEntity');
data.addColumn('string', 'ToolTip');
for (var i = 0; i < r.d.length; i++)
{
//var employeeId = r.d[i][0].toString();
//var employeeName = r.d[i][1];
//var designation = r.d[i][2];
//var reportingManager = r.d[i][3] != null ? r.d[i][3].toString() : '';
//data.addRows
var employeeId = r.d[i][0].toString();
var employeeName = r.d[i][1]
var designation = r.d[i][2];
var reportingManager = r.d[i][3];
var reportingManager = r.d[i][3] != null ? r.d[i][3].toString() : '';
data.addRows
([[{
f: employeeName,
v: employeeId,
//+ '<div>(<span>' + designation + '</span>)</div><img src = "Pictures/' + employeeId + '.jpg" />'
}, reportingManager, designation]]);
}
var chart = new google.visualization.OrgChart($("#chart")[0]);
chart.draw(data, { allowHtml: true });
},
failure: function (r) {
alert(r.d);
},
error: function (r) {
alert(r.d);
}
});
}
</script>
cs code
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Web.Services;
using System.Configuration;
using System.Data.SqlClient;
using SPM.BLL;
using DevExpress.Web;
namespace SPM
{
public partial class CS : System.Web.UI.Page
{
public static string TypeID, ID;
[WebMethod]
public static List<object> GetChartData()
{
string query = "SELECT SupplyChain.SellerID, SupplyChain.BuyerID, ViewAllCustomerForSpplyChain_1.CompanyName AS SellerName, ViewAllCustomerForSpplyChain.CompanyName AS BuyerName FROM SupplyChain INNER JOIN ViewAllCustomerForSpplyChain AS ViewAllCustomerForSpplyChain_1 ON SupplyChain.MasterID = ViewAllCustomerForSpplyChain_1.ID AND SupplyChain.MasterTypeID = ViewAllCustomerForSpplyChain_1.TypeID INNER JOIN ViewAllCustomerForSpplyChain ON SupplyChain.ChildID = ViewAllCustomerForSpplyChain.ID AND SupplyChain.ChildTypeID = ViewAllCustomerForSpplyChain.TypeID WHERE (SupplyChain.DeleteStatus = 0)";
//query += " FROM EmployeeHierarchy";
string constr = ConfigurationManager.ConnectionStrings["ConStr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand(query))
{
List<object> chartData = new List<object>();
cmd.CommandType = CommandType.Text;
cmd.Connection = con;
con.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
{
chartData.Add(new object[]
{
sdr["SellerID"], sdr["SellerName"], sdr["BuyerName"] , sdr["BuyerID"]
});
}
}
con.Close();
return chartData;
}
}
}
}
} 解决方案
.ajax({ type: "POST", url: "CS.aspx/GetChartData", data: '{}', contentType: "application/json; charset=utf-8", dataType: "json", success: function (r) { var data = new google.visualization.DataTable(); data.addColumn('string', 'Entity'); data.addColumn('string', 'ParentEntity'); data.addColumn('string', 'ToolTip'); for (var i = 0; i < r.d.length; i++) { //var employeeId = r.d[i][0].toString(); //var employeeName = r.d[i][1]; //var designation = r.d[i][2]; //var reportingManager = r.d[i][3] != null ? r.d[i][3].toString() : ''; //data.addRows var employeeId = r.d[i][0].toString(); var employeeName = r.d[i][1] var designation = r.d[i][2]; var reportingManager = r.d[i][3]; var reportingManager = r.d[i][3] != null ? r.d[i][3].toString() : ''; data.addRows ([[{ f: employeeName, v: employeeId, //+ '<div>(<span>' + designation + '</span>)</div><img src = "Pictures/' + employeeId + '.jpg" />' }, reportingManager, designation]]); } var chart = new google.visualization.OrgChart(
("#chart")[0]); chart.draw(data, { allowHtml: true }); }, failure: function (r) { alert(r.d); }, error: function (r) { alert(r.d); } }); } </script>
cs code
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data; using System.Web.Services; using System.Configuration; using System.Data.SqlClient; using SPM.BLL; using DevExpress.Web; namespace SPM { public partial class CS : System.Web.UI.Page { public static string TypeID, ID; [WebMethod] public static List<object> GetChartData() { string query = "SELECT SupplyChain.SellerID, SupplyChain.BuyerID, ViewAllCustomerForSpplyChain_1.CompanyName AS SellerName, ViewAllCustomerForSpplyChain.CompanyName AS BuyerName FROM SupplyChain INNER JOIN ViewAllCustomerForSpplyChain AS ViewAllCustomerForSpplyChain_1 ON SupplyChain.MasterID = ViewAllCustomerForSpplyChain_1.ID AND SupplyChain.MasterTypeID = ViewAllCustomerForSpplyChain_1.TypeID INNER JOIN ViewAllCustomerForSpplyChain ON SupplyChain.ChildID = ViewAllCustomerForSpplyChain.ID AND SupplyChain.ChildTypeID = ViewAllCustomerForSpplyChain.TypeID WHERE (SupplyChain.DeleteStatus = 0)"; //query += " FROM EmployeeHierarchy"; string constr = ConfigurationManager.ConnectionStrings["ConStr"].ConnectionString; using (SqlConnection con = new SqlConnection(constr)) { using (SqlCommand cmd = new SqlCommand(query)) { List<object> chartData = new List<object>(); cmd.CommandType = CommandType.Text; cmd.Connection = con; con.Open(); using (SqlDataReader sdr = cmd.ExecuteReader()) { while (sdr.Read()) { chartData.Add(new object[] { sdr["SellerID"], sdr["SellerName"], sdr["BuyerName"] , sdr["BuyerID"] }); } } con.Close(); return chartData; } } } } }
I'd strongly recommend to read this: Part 5: From Trees to Graphs[^] and this: Walkthrough: Displaying Hierarchical Data in a TreeView Control[^]
这篇关于多个parant子层次结构。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
