echarts 基础树图

下定决心，好好过一天 ~

var ROOT_PATH = 'https://cdn.jsdelivr.net/gh/apache/echarts-website@asf-site/examples';var chartDom = document.getElementById('main');
var myChart = echarts.init(chartDom);
var option;myChart.showLoading(); //显示加载
$.get(ROOT_PATH + '/data/asset/data/flare.json', function (data) {myChart.hideLoading();data.children.forEach(function (datum, index) {index % 2 === 0 && (datum.collapsed = true); //选择展示于不展示});myChart.setOption(option = {tooltip: {trigger: 'item', //数据项图形触发，主要在散点图，饼图等无类目轴的图表中使用triggerOn: 'mousemove' //鼠标移动时触发，还有click等等时触发},series: [{type: 'tree', //树图data: [data], //采用类似json格式的类型表示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'}},emphasis: {focus: 'descendant' //聚焦所有子孙节点},expandAndCollapse: true,animationDuration: 550,animationDurationUpdate: 750}]});
});option && myChart.setOption(option);

数据类型：

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！