更多>
最新下载
24小时阅读排行榜
- 1 html如何让两张图片显示在同一行
- 2 ServiceNow 中 Script Include 函数的跨文件调用方法
- 3 XML文件能删除吗 电脑中的XML文件误删后果
- 4 PHP 中 Asia/Beijing 时区的来源与正确处理方式
- 5 如何在Golang中配置集成测试环境_Golang集成测试环境搭建与配置
- 6 Go Channels: 如何让无缓冲通道实现非阻塞发送?
- 7 mysql权限管理自动化工具有哪些_mysql运维实践分享
- 8 如何在 CSS 中实现“最小宽度取文本自适应与固定值中的较小者”?
- 9 React Native 自定义启动页状态持久化与条件渲染最佳实践
- 10 Go 中并发写入文件的安全实践:使用通道协调多 goroutine 文件操作
- 11 Laravel 8 中高效查询商品库存汇总与重复数据识别
- 12 Go 中嵌入接口的反射安全调用:如何检测未实现方法并避免 panic
- 13 如何在表单内水平居中提交按钮(CSS 实战方案)
- 14 如何正确遍历 API 返回的数组对象并提取字段数据
- 15 计算两个 Bootstrap 日期选择器所选日期之间的完整年份差值
更多>
最新教程
-
- Node.js 教程
- 17212 2025-08-28
-
- CSS3 教程
- 1549153 2025-08-27
-
- Rust 教程
- 24202 2025-08-27
-
- Vue 教程
- 26399 2025-08-22
-
- PostgreSQL 教程
- 22865 2025-08-21
-
- Git 教程
- 9738 2025-08-21
jQuery组织结构图表插件OrgChart
js代码
<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/html2canvas.js"></script>
<script type="text/javascript" src="js/jquery.orgchart.js"></script>
<script type="text/javascript">
'use strict';
(function($){
$(function() {
var datascource = {
'name': 'Lao Lao',
'title': 'general manager',
'relationship': { 'children_num': 8 },
'children': [
{ 'name': 'Bo Miao', 'title': 'department manager', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 7 }},
{ 'name': 'Su Miao', 'title': 'department manager', 'relationship': { 'children_num': 2, 'parent_num': 1,'sibling_num': 7 },
'children': [
{ 'name': 'Tie Hua', 'title': 'senior engineer', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 1 }},
{ 'name': 'Hei Hei', 'title': 'senior engineer', 'relationship': { 'children_num': 2, 'parent_num': 1,'sibling_num': 1 },
'children': [
{ 'name': 'Pang Pang', 'title': 'engineer', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 1 }},
{ 'name': 'Xiang Xiang', 'title': 'UE engineer', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 1 }}
]
}
]
},
{ 'name': 'Yu Jie', 'title': 'department manager', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 7 }},
{ 'name': 'Yu Li', 'title': 'department manager', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 7 }},
{ 'name': 'Hong Miao', 'title': 'department manager', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 7 }},
{ 'name': 'Yu Wei', 'title': 'department manager', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 7 }},
{ 'name': 'Chun Miao', 'title': 'department manager', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 7 }},
{ 'name': 'Yu Tie', 'title': 'department manager', 'relationship': { 'children_num': 0, 'parent_num': 1,'sibling_num': 7 }}
]
};
$('#chart-container').orgchart({
'data' : datascource,
'depth': 2,
'nodeTitle': 'name',
'nodeContent': 'title'
});
});
})(jQuery);
</script>
jQuery组织结构图表插件OrgChart组织结构布局代码是一款可以使用本地数据,或通过ajax调用来完成数据的填充。
本站所有资源都是由网友投搞发布,或转载各大下载站,请自行检测软件的完整性!本站所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!如有侵权请联系我们删除下架,联系方式:admin@php.cn
