全称

业务板块

累计投资金额

${data.fullName || '--'}

新兴业务

${data.money || '--'}${data.cell || '万元'}

`; return str; }, }, series: [ { type: 'tree', orient: 'vertical', name: '自然资源厅', edgeShape: 'polyline', //链接线是折现还是曲线 data: data2, width: 1100, //树形图宽 height: 547, //树形图高 top: '20%', left: '10%', symbolSize: [60, 38], //设置自己选择区域的宽高 symbol: 'rect', //子级选择区域的形状默认circle(圆形),rect矩形 roam: true, //鼠标移到区块时会显示一个灰色背景的title，移动不同区域时是否开启滑动动画 initialTreeDepth: 10, itemStyle: { //symbol的样式 color: '#333', borderColor: '#333', }, label: { normal: { position: [30, 15], verticalAlign: 'middle', align: 'center', backgroundColor: '#99d97c', color: '#fff', padding: 3, formatter: function (params) { let money = params.data.money ? '' + params.data.money : ''; let percent = params.data.percent ? params.data.percent : ''; let name = params.name.substring(0, 11) + '\n' + params.name.substring(11); let konggu = params.value ? params.value : ''; if (konggu) { return [`{percent|${percent}}`, `{name|${name}}`, `{money|${money}}`].join('\n'); } else { return [ `{konggu|${konggu}}`, `{percent|${percent}}`, `{name|${name}}`, `{money|${money}}`, ].join('\n'); } }, rich: { percent: { color: '#FFF', padding: [-40, 0], height: 18, distance: 10, align: 'left', verticalAlign: 'top', fontSize: 12, borderWidth: 1, fontWeight: 'normal', }, name: { height: 18, color: '#FFF', padding: [2, 0], align: 'center', fontSize: 12, }, money: { height: 18, color: '#fff', padding: [-20, 0], align: 'center', fontSize: 12, borderWidth: 2, fontWeight: 'normal', }, }, }, }, leaves: { label: { normal: { position: [30, 15], verticalAlign: 'middle', align: 'center', backgroundColor: '#f3857c', // formatter: ['{box|{b}}'].join('\n'), // rich: { // box: { // height: 18, // color: '#fff', // padding: [20, 20], // align: 'center', // }, // }, formatter: function (params) { console.log(params); let money = params.data.money; let percent = params.data.percent; let name = params.name.substring(0, 11) + '\n' + params.name.substring(11); return [`{percent|${percent}}`, `{name|${name}}`, `{money|${money}}`].join('\n'); }, rich: { percent: { color: '#FFF', padding: [-30, 0], height: 18, distance: 10, align: 'left', verticalAlign: 'top', fontSize: 12, borderWidth: 1, fontWeight: 'normal', }, name: { height: 22, color: '#FFF', padding: [13, 0, 0, 0], align: 'center', fontSize: 12, }, money: { height: 18, color: '#fff', padding: [-20, 0], align: 'center', fontSize: 12, borderWidth: 2, fontWeight: 'normal', }, }, }, }, }, lineStyle: { color: { type: 'linear', x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: '#0E769D', // 0% 处的颜色 }, { offset: 1, color: '#939597', // 100% 处的颜色 }, ], global: false, // 缺省为 false }, }, expandAndCollapse: true, animationDuration: 550, animationDurationUpdate: 750, }, ], };

树图展示