Home >php教程 >php手册 >PHP (Html) + Css 实现组织结构图

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

WBOY
WBOYOriginal
2016-06-06 19:34:101684browse

网上有很多开源的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 实现组织结构图
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn