PHP (Html) + Css 实现组织结构图
网上有很多开源的js版本的组织结构图工具，不过假设有这么个场景，有一个10多m的xml文件，里面是组织关系，要用php解析，再到js生成，这个两个过程都是很费时的，尤其是js的渲染过程，大部分的js版本都是再生成div的方式，这肯定会更加的慢了。我的方法是，直接用php输出一个相应的html结构，我用的是一定结构的table,再通过css画画线就搞定了。具体的实现方法直接看代码就ok了。有问题可以讨论。
代码]
01
<?php
02
function PHPtoOrgChart(array $arr,$title='') {
03
echo '<table>';
04
$size=count($arr);
05
if($title!='') {
06
//head
07
08
echo '<tr>';
09
echo '<td colspan="'.($size*2).'">';
10
echo '<div class="charttext">'.$title.'</div>';
11
echo '</td>';
12
echo '</tr>';
13
//head line
14
15
16
echo '<tr>';
17
echo '<td colspan="'.($size*2).'">';
18
echo '<table><tr><th class="right width-50"></th><th class="width-50"></th></tr></table>';
19
echo '</td>';
20
echo '</tr>';
21
22
//line
23
if($size>=2){
24
25
$tdWidth=((100)/($size*2));
26
27
echo '<tr>';
28
echo '<th class="right" width="'.$tdWidth.'%"></th>';
29
echo '<th class="top" width="'.$tdWidth.'%"></th>';
30
for($j=1; $j<$size-1; $j++) {
31
echo '<th class="right top" width="'.$tdWidth.'%"></th>';
32
echo '<th class=" top" width="'.$tdWidth.'%"></th>';
33
}
34
echo '<th class="right top" width="'.$tdWidth.'%"></th>';
35
echo '<th width="'.$tdWidth.'%"></th>';
36
echo '</tr>';
37
}
38
}
39
//
40
echo '<tr>';
41
foreach($arr as $key=>$value) {
42
echo '<td colspan="2">';
43
if(is_array($value)) {
44
PHPtoOrgChart($value,$key);
45
} else {
46
echo '<div class="charttext">'.$value.'</div>';
47
}
48
echo '</td>';
49
}
50
echo '</tr>';
51
//
52
echo '</table>';
53
}
参考脚本代码：http://www.huiyi8.com/jiaoben/
页:
[1]