标签：des c style class blog code
用FusionCharts做甘特图
1.同步方式(用xml格式字符)
前台aspx代码
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26 |
<!DOCTYPE html><head runat="server"> <meta http-equiv="Content-Type"
content="text/html; charset=utf-8"
/> <title>FusionCharts甘特图使用(同步方式展示)</title> <script src="Scripts/FusionCharts.js"></script> <script src="Scripts/jquery-1.8.2.min.js"></script> <script> $(function
() { var
data = $("#dataXml").val(); var
chart = new
FusionCharts("../DependOn/Charts/FCF_Gantt.swf", "chartId", "900", "400"); chart.setDataXML(data); //用setDataXML方法加载xml格式数据 chart.render("chartContainer"); }); </script></head><body> <form id="form1"
runat="server"> <div id="chartContainer"> </div> <div id="hiddenArea"> <input type="hidden"
id="dataXml"
value="<%=dataXml %>"
/> </div> </form></body></html> |
后台aspx.cs(拼接xml格式字符串)
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77 |
protected
string dataXml = string.Empty; protected
void Page_Load(object
sender, EventArgs e) { StringBuilder xmlAppend = new
StringBuilder(); //设置报表的属性 xmlAppend.AppendLine(@"<chart showtasknames=‘1‘ dateformat=‘dd/mm/yyyy‘ tooltextbgcolor=‘FFFFFF‘ tooltextbordercolor=‘333333‘ ganttlinecolor=‘99CC00‘ ganttlinealpha=‘20‘ basefontcolor=‘333333‘ gridbordercolor=‘99CC00‘ taskbarroundradius=‘4‘ showshadow=‘0‘ ><categories bgcolor=‘333333‘ fontcolor=‘99cc00‘ isbold=‘1‘ fontsize=‘14‘><category start=‘1/9/2005‘ end=‘31/12/2005‘ name=‘2005‘ /><category start=‘1/1/2006‘ end=‘31/7/2006‘ name=‘2006‘ /></categories><categories bgcolor=‘99cc00‘ bgalpha=‘40‘ fontcolor=‘333333‘ align=‘center‘ fontsize=‘10‘ isbold=‘1‘><category start=‘1/9/2005‘ end=‘30/9/2005‘ name=‘Sep‘ /><category start=‘1/10/2005‘ end=‘31/10/2005‘ name=‘Oct‘ /><category start=‘1/11/2005‘ end=‘30/11/2005‘ name=‘Nov‘ /><category start=‘1/12/2005‘ end=‘31/12/2005‘ name=‘Dec‘ /><category start=‘1/1/2006‘ end=‘31/1/2006‘ name=‘Jan‘ /><category start=‘1/2/2006‘ end=‘28/2/2006‘ name=‘Feb‘ /><category start=‘1/3/2006‘ end=‘31/3/2006‘ name=‘March‘ /><category start=‘1/4/2006‘ end=‘30/4/2006‘ name=‘Apr‘ /><category start=‘1/5/2006‘ end=‘31/5/2006‘ name=‘May‘ /><category start=‘1/6/2006‘ end=‘30/6/2006‘ name=‘June‘ /><category start=‘1/7/2006‘ end=‘31/7/2006‘ name=‘July‘ /></categories><processes positioningrid=‘right‘ align=‘center‘ headertext=‘ Leader ‘ fontcolor=‘333333‘ fontsize=‘11‘ isbold=‘1‘ isanimated=‘1‘ bgcolor=‘99cc00‘ headerbgcolor=‘333333‘ headerfontcolor=‘99CC00‘ headerfontsize=‘16‘ bgalpha=‘40‘><process name=‘Mark‘ id=‘1‘ /><process name=‘Tom‘ id=‘2‘ /><process name=‘David‘ id=‘3‘ /><process name=‘Alan‘ id=‘4‘ /><process name=‘Adam‘ id=‘5‘ /><process name=‘Peter‘ id=‘6‘ /></processes><datatable showprocessname=‘1‘ fontcolor=‘333333‘ fontsize=‘11‘ isbold=‘1‘ headerfontcolor=‘000000‘ headerfontsize=‘11‘><datacolumn headerbgcolor=‘333333‘ width=‘150‘ headerfontsize=‘16‘ headeralign=‘left‘ headerfontcolor=‘99cc00‘ bgcolor=‘99cc00‘ headertext=‘ Team‘ align=‘left‘ bgalpha=‘65‘><text label=‘ MANAGEMENT‘ /><text label=‘ PRODUCT MANAGER‘ /><text label=‘ CORE DEVELOPMENT‘ /><text label=‘ Q & A / DOC.‘ /><text label=‘ WEB TEAM‘ /><text label=‘ MANAGEMENT‘ /></datacolumn></datatable><tasks width=‘10‘><task name=‘Survey‘ hovertext=‘Market Survey‘ processid=‘1‘ start=‘7/9/2005‘ end=‘10/10/2005‘ id=‘Srvy‘ color=‘99cc00‘ alpha=‘60‘ toppadding=‘19‘ /><task name=‘Concept‘ hovertext=‘Develop Concept for Product‘ processid=‘1‘ start=‘25/10/2005‘ end=‘9/11/2005‘ id=‘Cpt1‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Concept‘ showlabel=‘0‘ hovertext=‘Develop Concept for Product‘ processid=‘2‘ start=‘25/10/2005‘ end=‘9/11/2005‘ id=‘Cpt2‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Design‘ hovertext=‘Preliminary Design‘ processid=‘2‘ start=‘12/11/2005‘ end=‘25/11/2005‘ id=‘Desn‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Product Development‘ processid=‘2‘ start=‘6/12/2005‘ end=‘2/3/2006‘ id=‘PD1‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Product Development‘ processid=‘3‘ start=‘6/12/2005‘ end=‘2/3/2006‘ id=‘PD2‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Doc Outline‘ hovertext=‘Documentation Outline‘ processid=‘2‘ start=‘6/4/2006‘ end=‘1/5/2006‘ id=‘DocOut‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Alpha‘ hovertext=‘Alpha Release‘ processid=‘4‘ start=‘15/3/2006‘ end=‘2/4/2006‘ id=‘alpha‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Beta‘ hovertext=‘Beta Release‘ processid=‘3‘ start=‘10/5/2006‘ end=‘2/6/2006‘ id=‘Beta‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Doc.‘ hovertext=‘Documentation‘ processid=‘4‘ start=‘12/5/2006‘ end=‘29/5/2006‘ id=‘Doc‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Website Design‘ hovertext=‘Website Design‘ processid=‘5‘ start=‘18/5/2006‘ end=‘22/6/2006‘ id=‘Web‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Release‘ hovertext=‘Product Release‘ processid=‘6‘ start=‘5/7/2006‘ end=‘29/7/2006‘ id=‘Rls‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘Dvlp‘ hovertext=‘Development on Beta Feedback‘ processid=‘3‘ start=‘10/6/2006‘ end=‘1/7/2006‘ id=‘Dvlp‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘QA‘ hovertext=‘QA Testing‘ processid=‘4‘ start=‘9/4/2006‘ end=‘22/4/2006‘ id=‘QA1‘ color=‘99cc00‘ alpha=‘60‘ /><task name=‘QA2‘ hovertext=‘QA Testing-Phase 2‘ processid=‘4‘ start=‘25/6/2006‘ end=‘5/7/2006‘ id=‘QA2‘ color=‘99cc00‘ alpha=‘60‘ /></tasks><connectors color=‘99cc00‘ thickness=‘2‘><connector fromtaskid=‘Cpt1‘ totaskid=‘Cpt2‘ fromtaskconnectstart=‘1‘ /><connector fromtaskid=‘PD1‘ totaskid=‘PD2‘ fromtaskconnectstart=‘1‘ /><connector fromtaskid=‘PD1‘ totaskid=‘alpha‘ /><connector fromtaskid=‘PD2‘ totaskid=‘alpha‘ /><connector fromtaskid=‘DocOut‘ totaskid=‘Doc‘ /><connector fromtaskid=‘QA1‘ totaskid=‘beta‘ /><connector fromtaskid=‘Dvlp‘ totaskid=‘QA2‘ /><connector fromtaskid=‘QA2‘ totaskid=‘Rls‘ /></connectors><milestones><milestone date=‘29/7/2006‘ taskid=‘Rls‘ radius=‘10‘ color=‘333333‘ shape=‘Star‘ numsides=‘5‘ borderthickness=‘1‘ /><milestone date=‘2/3/2006‘ taskid=‘PD1‘ radius=‘10‘ color=‘333333‘ shape=‘Star‘ numsides=‘5‘ borderthickness=‘1‘ /><milestone date=‘2/3/2006‘ taskid=‘PD2‘ radius=‘10‘ color=‘333333‘ shape=‘Star‘ numsides=‘5‘ borderthickness=‘1‘ /></milestones></chart>"); dataXml = xmlAppend.ToString(); } |
2.异步方式(用xml格式字符)
前台html代码
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23 |
<!DOCTYPE html><head> <meta http-equiv="Content-Type"
content="text/html; charset=utf-8"
/> <title>FusionCharts甘特图使用(异步方式展示)</title> <script src="DependOn/FusionWidgets_XT_Charts/FusionCharts.js"></script> <script src="Scripts/jquery-1.8.2.min.js"></script> <script> $(function
() { $.get("Handler/GetDataToJson.ashx", "", function
(data) { var
chart = new
FusionCharts("../DependOn/Charts/FCF_Gantt.swf", "chartId", "900", "400"); chart.setJSONData(data); chart.render("chartContainer"); }, "json"); }); </script></head><body> <div id="chartContainer"> </div></body></html> |
一般处理程序代码
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23 |
public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; StringBuilder jsonAppend = new
StringBuilder(); jsonAppend.Append("{"); //开始标记 jsonAppend.Append("\"chart\":"); jsonAppend.Append("{\"showshadow\": \"0\",\"taskbarroundradius\": \"4\",\"gridbordercolor\": \"99CC00\",\"basefontcolor\": \"333333\",\"ganttlinealpha\": \"20\",\"ganttlinecolor\": \"99CC00\",\"tooltextbordercolor\": \"333333\",\"tooltextbgcolor\": \"FFFFFF\",\"dateformat\": \"dd/mm/yyyy\",\"showtasknames\": \"1\"},"); jsonAppend.Append("\"categories\": [{\"fontsize\": \"14\",\"isbold\": \"1\",\"fontcolor\": \"99cc00\",\"bgcolor\": \"333333\",\"category\": [{\"name\": \"2005\",\"end\": \"31/12/2005\",\"start\": \"1/9/2005\"},{\"name\": \"2006\",\"end\": \"31/7/2006\",\"start\": \"1/1/2006\"}]},"); jsonAppend.Append("{\"fontsize\": \"10\",\"isbold\": \"1\",\"fontcolor\": \"333333\",\"bgcolor\": \"99cc00\",\"align\": \"center\",\"bgalpha\": \"40\",\"category\": [{\"name\": \"Sep\",\"end\": \"30/9/2005\",\"start\": \"1/9/2005\"},{\"name\": \"Oct\",\"end\": \"31/10/2005\",\"start\": \"1/10/2005\"},{\"name\": \"Nov\",\"end\": \"30/11/2005\",\"start\": \"1/11/2005\"},{\"name\": \"Dec\",\"end\": \"31/12/2005\",\"start\": \"1/12/2005\"},{\"name\": \"Jan\",\"end\": \"31/1/2006\",\"start\": \"1/1/2006\"},{\"name\": \"Feb\",\"end\": \"28/2/2006\",\"start\": \"1/2/2006\"},{\"name\": \"March\",\"end\": \"31/3/2006\",\"start\": \"1/3/2006\"},{\"name\": \"Apr\",\"end\": \"30/4/2006\",\"start\": \"1/4/2006\"},{\"name\": \"May\",\"end\": \"31/5/2006\",\"start\": \"1/5/2006\"},{\"name\": \"June\",\"end\": \"30/6/2006\",\"start\": \"1/6/2006\"},{\"name\": \"July\",\"end\": \"31/7/2006\",\"start\": \"1/7/2006\"}]}],"); jsonAppend.Append("\"processes\": {\"fontsize\": \"11\",\"isbold\": \"1\",\"fontcolor\": \"333333\",\"bgcolor\": \"99cc00\",\"align\": \"center\",\"bgalpha\": \"40\",\"headerfontsize\": \"16\",\"headerfontcolor\": \"99CC00\",\"headerbgcolor\": \"333333\",\"isanimated\": \"1\",\"headertext\": \" Leader \",\"positioningrid\": \"right\",\"process\": [{\"name\": \"Mark\",\"id\": \"1\"},{\"name\": \"Tom\",\"id\": \"2\"},{\"name\": \"David\",\"id\": \"3\"},{\"name\": \"Alan\",\"id\": \"4\"},{\"name\": \"Adam\",\"id\": \"5\"},{\"name\": \"Peter\",\"id\": \"6\"}]},"); jsonAppend.Append("\"datatable\": {\"fontsize\": \"11\",\"isbold\": \"1\",\"fontcolor\": \"333333\",\"headerfontsize\": \"11\",\"headerfontcolor\": \"000000\",\"showprocessname\": \"1\",\"datacolumn\": [{\"bgcolor\": \"99cc00\",\"align\": \"left\",\"bgalpha\": \"65\",\"headerfontsize\": \"16\",\"headerfontcolor\": \"99cc00\",\"headerbgcolor\": \"333333\",\"headertext\": \" Team\",\"headeralign\": \"left\",\"width\": \"150\",\"text\": [{\"label\": \" MANAGEMENT\"},{\"label\": \" PRODUCT MANAGER\"},{\"label\": \" CORE DEVELOPMENT\"},{\"label\": \" Q & A / DOC.\"},{\"label\": \" WEB TEAM\"},{\"label\": \" MANAGEMENT\"}]}]},"); jsonAppend.Append("\"tasks\": {\"width\": \"10\",\"task\": [{\"name\": \"Survey\",\"end\": \"10/10/2005\",\"start\": \"7/9/2005\",\"id\": \"Srvy\",\"toppadding\": \"19\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"1\",\"hovertext\": \"Market Survey\"},{\"name\": \"Concept\",\"end\": \"9/11/2005\",\"start\": \"25/10/2005\",\"id\": \"Cpt1\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"1\",\"hovertext\": \"Develop Concept for Product\"},{\"name\": \"Concept\",\"end\": \"9/11/2005\",\"start\": \"25/10/2005\",\"id\": \"Cpt2\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"2\",\"hovertext\": \"Develop Concept for Product\",\"showlabel\": \"0\"},{\"name\": \"Design\",\"end\": \"25/11/2005\",\"start\":\"12/11/2005\",\"id\": \"Desn\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"2\",\"hovertext\": \"Preliminary Design\"},{\"name\": \"Product Development\",\"end\": \"2/3/2006\",\"start\": \"6/12/2005\",\"id\": \"PD1\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"2\"},{\"name\": \"Product Development\",\"end\":\"2/3/2006\",\"start\": \"6/12/2005\",\"id\": \"PD2\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"3\"},{\"name\": \"Doc Outline\",\"end\": \"1/5/2006\",\"start\": \"6/4/2006\",\"id\": \"DocOut\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"2\",\"hovertext\": \"Documentation Outline\"},{\"name\": \"Alpha\",\"end\":\"2/4/2006\",\"start\": \"15/3/2006\",\"id\": \"alpha\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"4\",\"hovertext\": \"Alpha Release\"},{\"name\": \"Beta\",\"end\": \"2/6/2006\",\"start\":\"10/5/2006\",\"id\": \"Beta\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"3\",\"hovertext\": \"Beta Release\"},{\"name\": \"Doc.\",\"end\": \"29/5/2006\",\"start\": \"12/5/2006\",\"id\": \"Doc\",\"alpha\": \"60\",\"color\":\"99cc00\",\"processid\": \"4\",\"hovertext\": \"Documentation\"},{\"name\": \"Website Design\",\"end\": \"22/6/2006\",\"start\": \"18/5/2006\",\"id\": \"Web\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"5\",\"hovertex\": \"Website Design\"},{\"end\": \"29/7/2006\",\"start\": \"5/7/2006\",\"id\": \"Rls\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"6\",\"hovertext\": \"Product Release\"},{\"name\": \"Dvlp\",\"end\": \"1/7/2006\",\"start\": \"10/6/2006\",\"id\": \"Dvlp\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\":\"3\",\"hovertext\": \"Development on Beta Feedback\"},{\"name\": \"QA\",\"end\": \"22/4/2006\",\"start\": \"9/4/2006\",\"id\": \"QA1\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"4\",\"hovertext\": \"QA Testing\"},{\"name\": \"QA2\",\"end\": \"5/7/2006\",\"start\": \"25/6/2006\",\"id\": \"QA2\",\"alpha\": \"60\",\"color\": \"99cc00\",\"processid\": \"4\",\"hovertext\": \"QA Testing-Phase 2\"}]},"); jsonAppend.Append("\"connectors\": [{\"color\": \"99cc00\",\"thickness\": \"2\",\"connector\": [{\"fromtaskconnectstart\": \"1\",\"totaskid\": \"Cpt2\",\"fromtaskid\": \"Cpt1\"},{\"fromtaskconnectstart\": \"1\",\"totaskid\": \"PD2\",\"fromtaskid\": \"PD1\"},{\"totaskid\": \"alpha\",\"fromtaskid\": \"PD1\"},{\"totaskid\": \"alpha\",\"fromtaskid\": \"PD2\"},{\"totaskid\": \"Doc\",\"fromtaskid\": \"DocOut\"}, {\"totaskid\": \"beta\",\"fromtaskid\": \"QA1\"},{\"totaskid\": \"QA2\",\"fromtaskid\": \"Dvlp\"},{\"totaskid\": \"Rls\",\"fromtaskid\": \"QA2\"}]}],"); jsonAppend.Append("\"milestones\": {\"milestone\": [{\"color\": \"333333\",\"borderthickness\": \"1\",\"numsides\": \"5\",\"shape\": \"Star\",\"radius\": \"10\",\"taskid\": \"Rls\",\"date\": \"29/7/2006\"},{\"color\": \"333333\",\"borderthickness\": \"1\",\"numsides\": \"5\",\"shape\": \"Star\",\"radius\": \"10\",\"taskid\": \"PD1\",\"date\": \"2/3/2006\"},{\"color\": \"333333\",\"borderthickness\": \"1\",\"numsides\": \"5\",\"shape\": \"Star\",\"radius\": \"10\",\"taskid\": \"PD2\",\"date\": \"2/3/2006\"}]}"); jsonAppend.Append("}"); //结束标记 context.Response.Write(jsonAppend.ToString()); } |
Demo下载 这个demo是模拟的数据，FusionCharts(Free版本)本身不支持json格式，异步方式的js文件是提取FusionWidgets_XT_Charts的js文件，这样就可以支持json了，
FusionCharts Free 甘特图,布布扣,bubuko.com
标签：des c style class blog code
原文地址：http://www.cnblogs.com/qq0827/p/3763623.html
