tsg-web/src/views/sz/zzjgck/jgoption.js

export default function jgOption(data1) {
  console.log("123", data1);
  const one = `${process.env.PUBLIC_URL}/assets/images/one.png`;
  const two = `${process.env.PUBLIC_URL}/assets/images/two.png`;
  const three = `${process.env.PUBLIC_URL}/assets/images/three.png`;
  const four = `${process.env.PUBLIC_URL}/assets/images/four.png`;
  return {
		series: [{
			type: 'tree',
			name: 'tree1',
			data: data1,
			top: '10%',
			left: '10%',
			bottom: '20%',
			right: '30%',
			avoidLabelOverlap: true,//防止标签重叠
			roam: true, //移动+缩放  'scale' 或 'zoom'：只能够缩放。 'move' 或 'pan'：只能够平移。
			scaleLimit:{ //缩放比例
				min:0.7,//最小的缩放值
				max:4,//最大的缩放值  
		    },
			layout: 'orthogonal',//树图布局，orthogonal水平垂直方向，radial径向布局 是指以根节点为圆心，每一层节点为环，一层层向外
			orient: 'LR', //树形方向  TB为上下结构  LR为左右结构
			// nodePadding: 100,//结点间距 （发现没用）
			//layerPadding: 30,//连接线长度 （发现没用）
			symbol: 'circle', //图形形状  rect方形  roundRect圆角 emptyCircle圆形 circle实心圆
			symbolSize: 14, //状态大小
			edgeShape: 'polyline', //线条类型  curve曲线
			initialTreeDepth: 3, //初始展开的层级
			expandAndCollapse: true,//子树折叠和展开的交互，默认打开
			lineStyle: {//结构线条样式
				width: 1,
				color: '#1E9FFF',
				type: 'solid'
			},
      label: {
        // 每个节点对应的文本标签样式
        show: true, // 是否显示标签
        // rotate:90,
        distance: 1, // 文本距离图形元素的距离
        position: ['50%', '50%'], // 标签位置
        verticalAlign: 'middle', // 文字垂直对齐方式，默认自动，top，middle，bottom
        align: 'center', // 文字水平对齐方式，默认自动，left，right，center
        fontSize: 16, // 字体大小
        color: '#000', // 字体颜色
        overflow: 'breakAll',
        formatter: (params) => {
          // let newName = ''
          // let len = params.data.title.length
          // let strLen = (params.data.parentId === 0 || params.data.parentId === 100 ) ? 100 : 1 //一行显示几个字
          // let rowNum = Math.ceil(len / strLen)
          // if (len > strLen) {
          
          //   for (let p = 0; p < rowNum; p++) {
          //     let tempStr = ''
          //     let start = p * strLen
          //     let end = start + strLen
          //     if (p == rowNum - 1) {
          //       tempStr = params.data.title.substring(start, len)
          //     } else {
          //       tempStr = params.data.title.substring(start, end) + '\n'
          //     }
          //     newName += tempStr
          //   }
          // } else {
          //   newName = params.data.title
          // }
          // let n = newName
          // if (n.length > 16) {
          //   n = n.slice(0, 16) + '...'
          // }
          let n = params.data.title;
          let parentId = params.data.parentId
          let userId = params.data.userId;
          let str = parentId === 0 ? `{parent|${n}}` : 
            parentId === 100 ? `{parent1|${n}}` : userId != undefined ? `{parent3|${n}}` : `{parent2|${n}}`
            // let str = parentId === 0 ? `<div class='org-parent'>${n}</div>` :
          // parentId === 100 ? `<div class='org-parent1'>${n}</div>` : userId != undefined ? `<div class='org-parent3'>${n}</div>` : `<div class='org-parent2'>${n}</div>`
          return  str;
        },
       
        rich: {
          parent: {
            color: '#000',
            padding: [15, 15],
            backgroundColor: {
              image: one
            },
            fontSize: 20
          },
          parent1: {
            color: '#000',
            padding: [10, 10],
            backgroundColor: {
              image: two
            },
            fontSize: 18
          },
          parent2: {
            fontSize: 18,
            color: '#000',
            align: 'center',
            padding: [10, 10],
            backgroundColor: {
              image: three,
              repeat: "norepeat",
            },
          },
          parent3: {
            width:200,
            color: '#000',
            padding: [10, 10],
            overflow:'break',
            backgroundColor: {
              image: four,
            },
            align: 'center',
            fontSize: 18,
          },
        }
      },

     
			leaves: { //叶子节点文本样式
				label: {
					// backgroundColor: '#81c5f7',
					backgroundColor: '#fff',
					color:'#333',
					position: 'bottom',
					rotate: 0,//标签旋转。
					verticalAlign: 'middle',
          align: 'center',
          position: ['50%', '50%'], // 标签位置
					//文本框内文字超过6个字折行
					//  formatter: function(val) {
					//  let strs = val.name.split(''); //字符串数组
					//  let str = ''
					//  for(let i = 0, s; s = strs[i++];) { //遍历字符串数组
					//    str += s;
					//    if(!(i % 6)) str += '\n'; //按需要求余，目前是一个字换一行
					//  }
					//  return str
				  //  },
				   //或者 
				   overflow:'break',//break为文字折行，  truncate为文字超出部分省略号显示
				   lineOverflow:'truncate',//文字超出高度后 直接截取
				}
			},
			expandAndCollapse: true, //默认展开树形结构
			animationDuration: 550,
      animationDurationUpdate: 750,
		}]
	};
}