echarts树形图样式_echarts实现树形图绘制

$(function () {

//本周详细信息

var tree_echarts_id = 'tree_echarts';

var tree_data = {{tree_data|safe}};

echarts_tree(tree_echarts_id, tree_data);

});

//树形图

function echarts_tree(id, data) {

// 基于准备好的dom，初始化echarts实例

var myChart = echarts.init(document.getElementById(id));

// 指定图表的配置项和数据

option = {

tooltip: {

trigger: 'item',

triggerOn: 'mousemove'

},

toolbox: {

show: true,

feature: {

saveAsImage: {show: true}

}

},

series: [

{

type: 'tree',

data: data,

top: '1%',

left: '7%',

bottom: '1%',

right: '50%',

symbolSize: 7,

label: {

normal: {

position: 'left',

verticalAlign: 'middle',

align: 'right',

fontSize: 12

}

},

leaves: {

label: {

normal: {

position: 'right',

verticalAlign: 'middle',

align: 'left'

}

}

},

expandAndCollapse: true,

animationDuration: 550,

animationDurationUpdate: 750

}

]

}

// 使用刚指定的配置项和数据显示图表。

myChart.setOption(option);

}

image.png