首页  >  文章  >  php教程  >  PHP (Html) + Css 实现组织结构图

PHP (Html) + Css 实现组织结构图

WBOY
WBOY原创
2016-06-06 19:34:101616浏览

网上有很多开源的js版本的组织结构图工具,不过假设有这么个场景,有一个10多m的xml文件,里面是组织关系,要用php解析,再到js生成,这个两个过程都是很费时的,尤其是js的渲染过程,大部分的js版本都是再生成div的方式,这肯定会更加的慢了。 我的方法是,

网上有很多开源的js版本的组织结构图工具,不过假设有这么个场景,有一个10多m的xml文件,里面是组织关系,要用php解析,再到js生成,这个两个过程都是很费时的,尤其是js的渲染过程,大部分的js版本都是再生成div的方式,这肯定会更加的慢了。

我的方法是,直接用php输出一个相应的html结构,我用的是一定结构的table,再通过css画画线就搞定了。具体的实现方法直接看代码就ok了。有问题可以讨论。 PHP-to-OrgChart
<?php
    function PHPtoOrgChart(array $arr,$title='') {
        echo '<table>';
        $size=count($arr);
        if($title!='') {
            //head

            echo '<tr>';
            echo '<td colspan="'.($size*2).'">';
            echo '<div class="charttext">'.$title.'</div>';
            echo '</td>';
            echo '</tr>';
            //head line


            echo '<tr>';
            echo '<td colspan="'.($size*2).'">';
            echo '<table><tr><th class="right width-50"></th><th class="width-50"></th></tr></table>';
            echo '</td>';
            echo '</tr>';

            //line
            if($size>=2){

            $tdWidth=((100)/($size*2));

            echo '<tr>';
            echo '<th class="right" width="'.$tdWidth.'%"></th>';
                echo '<th class="top" width="'.$tdWidth.'%"></th>';
                for($j=1; $j<$size-1; $j++) {
                    echo '<th class="right top" width="'.$tdWidth.'%"></th>';
                    echo '<th class=" top" width="'.$tdWidth.'%"></th>';
                }
                echo '<th class="right top" width="'.$tdWidth.'%"></th>';
            echo '<th width="'.$tdWidth.'%"></th>';
            echo '</tr>';
            }
        }
        //
        echo '<tr>';
        foreach($arr as $key=>$value) {
            echo '<td colspan="2">';
            if(is_array($value)) {
                PHPtoOrgChart($value,$key);
            } else {
                echo '<div class="charttext">'.$value.'</div>';
            }
            echo '</td>';
        }
        echo '</tr>';
        //
        echo '</table>';
    }
PHP (Html) + Css 实现组织结构图
声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn