XML和XSL生成类PowerPoint组织结构图(一)

原创 2004年01月04日 10:21:00

XMLXSL生成类PowerPoint组织结构图

 

         近日我正在潜心初学XMLXSL的相关技术,一日,漫漫长夜,无心睡眠,突心血来潮,想一试自己这段时间所学。因有感每日所用XML数据格式的层次性,总觉和树状结构的有相似之处,同时,受工作中要实现一组织结构图的鼓惑,故就尝试用XMLXSL来实现一个自己已用ASP实现的类似PowerPoint中的组织结构图,功成之时,不亦乐乎,掩饰不住的暗爽,真是不吐不快。故欲将其中的艰辛和喜悦,困难和收获一并拿出,希望能和象我一样初学XML的、或是已是高手高手高高手的各位分享之。好,口说无凭,列位上眼呐!

实现的组织结构如下图所示:

 

 

         该组织结构图实现的主要功能为:

                   无层数限制的显示各个层之间的相关关系。

                   通过点击各节点旁边的“+”,“-”图标来展开或收缩该节点的下属层。

 

首先先来看一下相关的文件结构

Organize .xml数据文件如下:

<?xml version="1.0" encoding="UTF-8"?>

<?xml-stylesheet type="text/xsl" href="Organize.xsl"?>

<Root>

   <Layer>

       <id/>

       <text/>

   </Layer>

   <Layer>

       <id>01</id>

       <text>XX集团</text>

   </Layer>

   <Layer>

       <id>0101</id>

       <text>上海分公司</text>

   </Layer>

   ……

   <Layer>

       <id>0103</id>

       <text>北京分公司</text>

   </Layer>

   <Layer>

       <id>010101</id>

       <text>人事部</text>

   </Layer>

   ……

   <Layer>

       <id>010302</id>

       <text>财务部</text>

   </Layer>

   <Layer>

       <id>01030101</id>

       <text>人事部经理</text>

   </Layer>

   <Layer>

       <id>01030102</id>

       <text>人事部助理</text>

   </Layer>

   ……

   <Layer>

       <id>01010301</id>

       <text>技术经理</text>

   </Layer>

……

</Root>

 

Organize.xsl文件内容如下:

<?xml version="1.0" encoding="UTF-8"?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

   <xsl:template match="/">

       <html>

          <head>

             <title>组织结构图</title>

          </head>

          <style type="text/css">

             ……

          </style>

          <body>

             <center>

             <br></br>

             <span>组织结构图</span>

             <div>

                 <xsl:call-template name="getLayer">

                    <xsl:with-param name="LayerID" select="/Root/Layer[1]/id"/>

                 </xsl:call-template>

             </div>

             </center>

          </body>

       </html>

   </xsl:template>

 

   <xsl:template name="getLayer">

       <xsl:param name="LayerID"/>

       <xsl:for-each select="//Layer[substring(id,1,string-length($LayerID))=$LayerID

          and string-length(id)=string-length($LayerID)+2]">

     <span>

             ……   ------ 省略了div的样式表

             <img src="close.gif" alt="">

                ……   ------ 省略了img图标的相关操作

             </img>

             <span>

                <a href="#" target="newWindow">

                    <xsl:value-of select="./text"/>

                 </a>

             </span>

             <div>

                ……   ------ 省略了div的样式表

                <xsl:call-template name="getLayer">

                    <xsl:with-param name="LayerID" select="id"/>

                 </xsl:call-template>

                  </div>

xsl与xml转换示例

java xml,xsl,html文件转换   java文件代码: package com.test; import java.io.ByteArrayInputStream; imp...
  • lvyuan30276
  • lvyuan30276
  • 2016年01月05日 23:41
  • 2389

xml与xsl的转换

xml文档的一大特点是可以向多种格式的文档进行转换。比如,从一种逻辑结构的xml向另一种逻辑结构的xml转换,或是转换为可浏览的html文档等。这种xml文档的数据格式转换功能由可扩展样式单语言(xs...
  • lvyuan30276
  • lvyuan30276
  • 2016年01月05日 23:28
  • 1274

XML文件与xsl文件的作用与关系

XML文件的发明可以说是计算机领域的一大进步,有着说不清的好处,比如格式规范,跨平台等。XML文件的主要作用是数据的载体,用于承载数据。跟XML相关的格式文件还有一大堆,这里我们慢慢来说清楚。   ...
  • sundacheng1989
  • sundacheng1989
  • 2016年08月09日 14:01
  • 4182

浅析UML之组织结构图

组织结构图compositestructure diagram 系统是一个整体,但是我们要针对不同的部门、类别划分子系统,so,我们一般在开发系统的时候首先开始开发子系统,到最后的时候我们在进行子系...
  • tsj11514oo
  • tsj11514oo
  • 2014年07月29日 22:33
  • 1400

Chrome无法用xsl显示xml文档

今天在做一个xml的小试验时,发现Chrome竟然无法显示经过xsl修饰的文档!!这么高级的浏览器不应该存在这样的情况啊。经过一翻折腾加google后,发现确实是因为Chrome太高级了所以无法显示:...
  • jnuyanfa
  • jnuyanfa
  • 2016年04月25日 22:43
  • 1618

xml与xsl的转换

出处:http://blog.csdn.net/lvyuan30276/article/details/50466052 xml文档的一大特点是可以向多种格式的文档进行转换。比如,从一种逻辑结构的x...
  • yintianqin
  • yintianqin
  • 2017年02月07日 10:21
  • 222

组织结构图 js实现

最近公司需要将原来项目里 机构的树状展示图形添加一个 组织结构图的展示。 在网上找了找代码,感觉这个 http://blog.sina.com.cn/s/blog_6d0c777b01013mwj...
  • a1396910249
  • a1396910249
  • 2015年12月31日 13:49
  • 5575

通过XSLT转换XML

一 介绍 XSLT是一种用来转换XML文档结构的语言,它是EXtensible Style Language Extensions Transformations的缩写。 XSLT类似与HTML中...
  • chengqiuming
  • chengqiuming
  • 2017年04月12日 10:47
  • 482

对用DIV+CSS+JS实现多子部门组织结构图的改进

这是回复论坛一坛友的问题涉及到的。 坛友给出的组织结构图,主要是解决在子部门较多时一排放不下的情况怎么办。虽然利用折叠可以放下,但是却可能对组织关系造成误解。我提出了两种改进的方法,大意相同,只是后一...
  • theforever
  • theforever
  • 2016年08月11日 18:32
  • 1717

基于d3.js的组织结构图实现

一、效果图: 二、数据结构 data.json: { “name”:”中国”, “number”:”2000”, “children”: [ ...
  • wanglei1991gao
  • wanglei1991gao
  • 2017年05月05日 23:43
  • 2674
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:XML和XSL生成类PowerPoint组织结构图(一)
举报原因:
原因补充:

(最多只允许输入30个字)