var data2 = [{
name: "防汛",
type:0,
children: [{
name: "流程",
type:0,
fontType: 0,
children: [{
name: "全区信暴雨预警",
type:0,
fontType:1,
}]
}, {
name: "暴雨预警",
type:1,
fontType: 1,
children: [{
name: "蓝色预警",
type:2,
fontType:1,
children: [{
name: "蓝色预警由去气象预警系统预警",
type:0,
fontType:1,
}, ]
}, {
name: "黄色预警",
type:3,
fontType:1,
children: [{
name: "蓝色预警由去气象预警系统预警",
type:0,
fontType:1,
}, ]
}, {
name: "橙色预警",
type:4,
fontType:1,
children: [{
name: "蓝色预警由去气象预警系统预警",
type:0,
fontType:1,
}, ]
}, {
name: "红色预警",
type:5,
fointType:1,
children: [{
name: "蓝色预警由去气象预警系统预警",
type:0,
fontType:1,
}, ]
}]
}, {
name: "地质灾害气象风险预警",
type:1,
fontType:1,
children: [{
name: "蓝色预警",
type:2,
children: [{
name: "蓝色预警由去气象预警系统预警",
type:0,
fontType:1,
}, ]
}, {
name: "黄色预警",
type:3,
fontType:1,
children: [{
name: "蓝色预警由去气象预警系统预警",
type:0,
fontType:1,
}, ]
}, {
name: "橙色预警",
type:4,
fontType:1,
children: [{
name: "蓝色预警由去气象预警系统预警",
type:0,
fontType:1,
}, ]
}, {
name: "红色预警",
type:5,
fontType:1,
children: [{
name: "蓝色预警由去气象预警系统预警",
type:0,
fontType:1,
}, ]
}]
},{
name: "流程",
type:0,
fontType: 0,
children: [{
name: "全区信暴雨预警1111111111111",
type:0,
fontType:1,
}]
},
]
}];
var dataList = [];
const fontList=['#34adf6', '#181818']
const colorList = [ '#f2f2f2', '#85ccc9', '#029aff', '#ffff02', '#ff9a02', '#ff3503',]
function convertData(data) {
data.forEach(function(item) {
var newItem = {
name: item.name,
label: {
backgroundColor: colorList[item.type],
},
children: []
};
if (item.children) {
newItem.children = convertChildren(item.children);
}
dataList.push(newItem);
});
}
function convertChildren(children) {
var newChildren = [];
children.forEach(function(child) {
var newChild = {
name: child.name,
label: {
backgroundColor: colorList[child.type],
rich: {
box: {
color: fontList[child.fontType],
fontSize: 13,
fontWeight: 500,
height: 30,
padding: [0, 5],
align: 'center'
}
}
},
children: []
};
if (child.children) {
newChild.children = convertChildren(child.children);
}
newChildren.push(newChild);
});
return newChildren;
}
convertData(data2);
option = {
ooltip: {
trigger: 'item',
formatter: '{b}'
},
legend: {
},
series: [
{
type: 'tree',
name: '',
// edgeShape: 'polyline', //链接线是折现还是曲线
data:dataList,
top: '1%',
right: '50%',
symbolSize: 1,
initialTreeDepth: 6,
label: {
position: 'center',
verticalAlign: 'middle',
borderRadius: 5,
backgroundColor:'',
align: 'left',
padding: 3,
color: '#fff',
fontSize: 14,
formatter: [
'{box|{b}}'
].join('\n'),
rich: {
box: {
color: '#424141',
fontSize: 15,
height: 30,
fontWeight: 600,
padding: [0, 5],
align: 'center'
}
}
},
leaves: {
label: {
position: 'center',
verticalAlign: 'middle',
align: 'left',
formatter: [
'{box|{b}}'
].join('\n'),
rich: {
box: {
height: 18,
color: '#2c2a2a',
padding: [0, 5],
align: 'center'
}
}
}
},
expandAndCollapse: false,
animationDuration: 550,
animationDurationUpdate: 750
}
]
};