d3实现组织结构架构图代码-html代码-BFW代码库

d3实现组织结构架构图代码

代码语言：html

所属分类：图表

代码描述：d3实现组织结构架构图代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">

  
  

 

</head>

<body  >
  <div id="dynamicTree"></div>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.1.11.min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/d3.3.5.5.js"></script>
      <script >
function Tree(option) {
  var _fontSize = 10;
  var defaultOpt = {
    width: 900,
    height: 900,
    offsetTreeH: 200, //影响树形横向的区域
    nodeHeight: 20, //节点rect高度
    nodeWidth: { //传参为null就按字数设置宽度
      _0: 160,
      _1: 160,
      _2: 130,
      _3: 110,
      _4: 160 },
    //默认节点宽度
    selector: null, //挂载元素
    fontNum: 1.2, //设置字体大小因子
    fontColors: { //字体颜色
      normal: '#fff',
      warning: '#e3e3e1',
      errors: '#f00' },

    bgColors: {
      normal: '#35ad5b',
      warning: '#e3e3e1',
      errors: '#f00' },

    dataUrl: '' //必填
  };

  option = $.extend(true, defaultOpt, option);

  this.width = option.width;
  this.height = option.height;
  this.nodeHeight = option.nodeHeight;
  this.nodeWidth = option.nodeWidth;
  this.offsetTreeH = option.offsetTreeH;
  this.selector = option.selector == null ? "body" : option.selector;
  this.fontNum = option.fontNum;
  this.fon.........完整代码请登录后点击上方下载按钮下载查看