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

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

WBOY
Release: 2016-06-06 19:34:10
Original
1687 people have browsed it

网上有很多开源的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>';
    }
Copy after login
PHP (Html) + Css 实现组织结构图
Related labels:
source:php.cn
Statement of this Website
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
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template