原创:用Html画WorkFlow流程图经验分享

做MIS系统无非就是天天围绕着用户满意度在转,最近两天就一直在为流程的图形化忙晕了,最开始想用一些目前比较前沿的技术(如:Silverlight,Flex...)来画,不过因时间及环境关系放弃了,改用以下最原始的方式.

功夫不负有心人,折腾了个像模像样的,先上效果图:

(可以生成任意多分支路由的流程图,单人图表示或汇聚节点,多人图表示与汇聚节点,+号图表示节点为嵌套子流程,箭头图标表示路由分支...)

代码

//生成流程图
flowStr.Append("<table align='center'> \r\n");
for (int m = 1; m <= row; m++)
{
flowStr.Append("<tr> \r\n");
for (int n = 1; n <= col; n++)
{
flowStr.Append("<td align='center'>");
DataRow[] dr = flowdt.Select("Row=" + m + " and Col=" + n);
if (dr != null && dr.Length == 1)
{
string nodeDesc = dr[0]["NodeDesc"].ToString();
string eleType = dr[0]["EleType"].ToString();
bool isLast = Convert.ToBoolean(dr[0]["IsLast"]);
flowStr.Append(GenTableCol(nodeDesc, eleType, isLast));
}
　　 flowStr.Append("</td> \r\n");
}
flowStr.Append("</tr> \r\n");
}
flowStr.Append("</table>");

OK,到此就可以预览流程图了,效果还勉强可以凑合...

哪位还有没有更好的方法呢? 欢迎一起探讨!