echarts数状图后台迭代

出效果图：

 

此处贴前端代码，有疑问可以查echarts官网，问度娘也可以OK

<script type="text/javascript">
	var trees;
	var treeNames = [];
	//初始化加载
	$(function() {
		$.ajax({
			url : "${ctx}/clientorganizationchart/clientorganizationchart/getClients",
			type : 'POST', //GET
			/* async:false *///或false,是否异步
			timeout : 5000, //超时时间
			dataType : 'json', //返回的数据格式：json/xml/html/script/jsonp/text
			success : function(data) {
				for (var int = 0; int < data.length; int++) {
					$("#content").append("<div id='clientorganization"+int+"' style='width: 100%;height:800px;border:1px ;'></div>"); 
					var myChart = echarts.init(document.getElementById("clientorganization"+int));
					myChart.setOption(option = {
						tooltip : {
							trigger : 'item',
							triggerOn : 'mousemove'
						},
						legend : {
							top : '2%',
							left : '3%',
							orient : 'vertical',
							data : data[int].name,
							borderColor : '#c23531'
						},
						series : {
							type : 'tree',
							name : data[int].name,
							data : [data[int]],
							symbolSize : 15,
							label : {
								normal : {
								 	position : 'top',
									verticalAlign : 'middle',
									align : 'right'
								}
							},
							leaves : {
								label : {
									normal : {
										position : 'right',
										verticalAlign : 'middle',
										align : 'left'
									}
								}
							},
							expandAndCollapse : true,
							animationDuration : 550, 
							animationDurationUpdate : 750
						}
						
					});
					myChart.showLoading();
					myChart.hideLoading();
				}
			},
			error : function(xhr, textStatus) {
				console.log('错误');
				console.log(xhr);
				console.log(textStatus);
			}
		});
	});
	
	function seriesInfo(data) {
		var series = [];
			var treeName = data.name;
			treeNames.push(treeName);
			series.push({
				type : 'tree',
				name : treeName,
				data : [data],
				symbolSize : 15,
				label : {
					normal : {
					 	position : 'top',
						verticalAlign : 'middle',
						align : 'right'
					}
				},
				leaves : {
					label : {
						normal : {
							position : 'right',
							verticalAlign : 'middle',
							align : 'left'
						}
					}
				},
				expandAndCollapse : true,
				animationDuration : 550, 
				animationDurationUpdate : 750
			});
	}
</script>

此处贴Controller代码：

实体可以给参考：

private static final long serialVersionUID = 1L;
	private Clientorganizationchart parent;		// 父级编号
	private String parentIds;		// 所有父级编号
	private String companycode;		// 机构编码
	private String name;		// 单位名称
	private Integer sort;		// 排序
	private String auterpermission;//授权对象
	private String file1;//授权对象，存储，做比较用的
	private String file2;//自定义字段

	private String file3;//自定义字段
	private String file4;//自定义字段

 

    @RequestMapping(value="getClients")
    @ResponseBody
    public List<Map<String,Object>> getClients() {
		List<Map<String,Object>> result = new ArrayList<Map<String,Object>>();
        Map<String, Object> map = null;
        List<Clientorganizationchart> clientorganizationcharts = clientorganizationchartService.findList(new Clientorganizationchart());
        for(Clientorganizationchart item : clientorganizationcharts){
            if(item.getParentId()==null || item.getParentId().equals("0")) {//ParentId = 0 表示父级菜单
                map = new HashMap<String, Object>();
                map.put("id", item.getId());
                map.put("name", item.getName());
                this.getParment(map, clientorganizationcharts);
                result.add(map);
            }
        }
        return result;
    }

    public void getParment(Map<String, Object> map, List<Clientorganizationchart> clientorganizationcharts){
		List<Map<String,Object>> list =  new ArrayList<Map<String,Object>>();
		for (Clientorganizationchart resourceDto : clientorganizationcharts) {
			Map<String, Object> map2 = new HashMap<String, Object>();
			if (map.get("id").equals(resourceDto.getParent())) {
				map2.put("id", resourceDto.getId());
				map2.put("name", resourceDto.getName());
				list.add(map2);
				getParment(map2, clientorganizationcharts);
			}
		}
		map.put("children", list);
	}