如何使用.NET DataTable从谷歌图表工具/虚拟化API创建组织结构图？

我想创建一个组织结构图如下所示： http://code.google.com/apis/visualization/documentation/gallery/orgchart.html 如何使用.NET DataTable从谷歌图表工具/虚拟化API创建组织结构图？

我可以创建使用从这里.NET可视化辅助库中的JSON字符串google.visualization.DataTable： http://code.google.com/p/bortosky-google-visualization/

本

不幸助手库，因为f：key不是由助手库生成的，所以不可能为每个组织结构图成员显示像总裁或副总裁这样的自定义格式消息。

来源

2010-07-14 Mathias Florin

我能写，从一个C＃的DataTable创建的组织结构图JSON的方法来解决这个问题：

public string GoogleOrgChartJson(DataTable dt) 
     { 
      if ((dt == null) || (dt.Columns.Count == 0)) return ""; 
      var sb = new StringBuilder(); 
      sb.Append("{cols: ["); 
      foreach (DataColumn dc in dt.Columns.Cast<DataColumn>().Where(dc => dc.Caption != "Format")) 
      { 
       sb.Append("{id: '"); 
       sb.Append(dc.Caption); 
       sb.Append("', label: '"); 
       sb.Append(dc.Caption); 
       sb.Append("', type: '"); 
       sb.Append(dc.DataType.Name.ToLower()); 
       sb.Append("'}, "); 
      } 
      sb.Remove(sb.Length - 2, 2); 
      sb.Append("], rows: ["); 
      foreach (DataRow dr in dt.Rows) 
      { 
       sb.Append("{c: ["); 
       for (int i = 0; i < dt.Columns.Count; i++) 
       { 
        if (dt.Columns[i].ToString() == "Format") 
        { 
         sb.Remove(sb.Length - 3, 3); 
         sb.Append(", f: '"); 
        } 
        else 
         sb.Append("{v: '"); 

        if ((dr[i] != DBNull.Value) && (string)dr[i] != "") 
         sb.Append(dr[i] + "'}, "); 
        else 
         sb.Append("'}, "); 

       } 
       sb.Remove(sb.Length - 2, 2); 
       sb.Append("]}, "); 
      } 
      sb.Remove(sb.Length - 2, 2); 
      sb.Append("]};"); 
      return sb.ToString(); 
     }

正如你从代码中看到上面我们需要有一个名为列的DataTable格式，以便在JSON中生成f键。请在下面找到一个C＃的DataTable的例子，调用创建JSON为谷歌图表API：

var dt = new DataTable(); 
dt.Columns.Add("Name", typeof (String)).Caption = "Name"; 
dt.Columns.Add("Format", typeof (String)).Caption = "Format"; 
dt.Columns.Add("Manager", typeof (String)).Caption = "Manager"; 
dt.Rows.Add("Mathias Florin","Mathias Florin<div style=color:red; font-style:italic><p style=font-size:0.7em>Technical Leader</p></div>","Christian Florin"); 
dt.Rows.Add("Christian Florin","Christian Florin<div style=color:red; font-style:italic><p style=font-size:0.7em>CEO</p></div>","Christian Florin"); 
Page.ClientScript.RegisterStartupScript(GetType(), "vis", string.Format("var fundata = {0}", GoogleOrgChartJson(dt)), true);

附加列，经理柱后加入，可以在JavaScript中的select事件进行访问谷歌图表api。

来源

2010-07-14 15:00:16

如何使用.NET DataTable从谷歌图表工具/虚拟化API创建组织结构图？

回答

相关问题