
// 原始数据
var data1 = getData('data1');
// 将原始数据转换为 ECharts 树图需要的格式
function transformData(data) {
// 构建 id 到节点的映射
var nodeMap = {};
var root;
// 遍历原始数据,创建节点对象
for (var i = 1; i < data.length; i++) {
var name = data[i][0];
var id = data[i][1];
var parentId = data[i][2];
var node = { name: name, children: [] };
nodeMap[id] = node;
if (!parentId) {
root = node;
}
}
// 遍历原始数据,设置父子关系
for (var i = 1; i < data.length; i++) {
var id = data[i][1];
var parentId = data[i][2];
if (parentId) {
nodeMap[parentId].children.push(nodeMap[id]);
}
}
return root;
}
var treeData = transformData(data1);
// 基于准备好的 DOM,初始化 echarts 实例
// var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var option = {
tooltip: {
trigger: 'item',
triggerOn: 'mousemove'
},
series: [
{
type: 'tree',
data: [treeData],
top: '1%',
left: '7%',
bottom: '1%',
right: '20%',
symbolSize: 7,
label: {
position: 'left',
verticalAlign: 'middle',
align: 'right',
fontSize: 9
},
leaves: {
label: {
position: 'right',
verticalAlign: 'middle',
align: 'left'
}
},
expandAndCollapse: true,
animationDuration: 550,
animationDurationUpdate: 750
}
]
};
// 使用刚指定的配置项和数据显示图表
myChart.setOption(option);