标签：遍历 obj String 递归 家谱 sbStart left append name
一、普通的html+div
//1.参数ID+要拼接的字符串
private void getAllPersonSonInfoById(String personId, StringBuilder sbStart) {
List personSonList = dao.getPersonSonInfoById(personId);
if (!personSonList.isEmpty()) {
sbStart.append("<ul>");
for (int i=0;i<personSonList.size();i++) {
Object[] obj = (Object[]) personSonList.get(i);
String sonId = obj[0].toString();
String sonName = obj[1].toString();
String sonPeerage = obj[2].toString();
sbStart.append("<li>");
sbStart.append(href).append(sonPeerage).append(img).append(sonName).append("</a>");
getAllPersonSonInfoById(sonId, sbStart);
sbStart.append("</li>");
}
sbStart.append("</ul>");
}
}
2.html页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>家谱</title>
<link href="${base}/res/common/css/huangzu.css" rel="stylesheet"
type="text/css" />
<script type="text/javascript">
function test() {
if (document.getElementById("test").style.display == "none") {
document.getElementById("test").style.display = "";
} else {
document.getElementById("test").style.display = "none";
}
}
</script>
</head>
<body>
<div class="tree">
回显的结果字符串
</div>
<div
style="display: none; background-color: gray; width: 353px; position: absolute; padding: 10px; left: 27%;"
id="test">
<p>姓名：穆尔哈齐</p>
<p>排行：显祖第二子</p>
<p>生母：庶妃李佳氏</p>
<p>生卒年：明嘉靖四十年～天命五年九月初十日</p>
<p>爵位：顺治十年五月，追封贝勒。</p>
<p>谥号：勇壮</p>
<p>共有11子</p>
</div>
</body>
</html>
二、
1.echarts数据
private void getAllPersonSonInfoAllById(String personId, String name, String peerage, StringBuilder sbStart,String splitStr) {
List personList = dao.getPersonSonInfoAllById(personId);
sbStart.append(splitStr).append("{").append("\"name\": ").append("\"" + name).append("("+peerage+")\"");
if (!CollectionUtils.isEmpty(personList)) {
sbStart.append(",").append("\"children\"").append(":[").append("");
for (int i = 0; i < personList.size(); i++) {
Object[] obj = (Object[]) personList.get(i);
String sonId = obj[0].toString();
String sonName = obj[1].toString();
String sonPeerage = obj[2].toString();
if(i == 0){
getAllPersonSonInfoAllById(sonId, sonName, sonPeerage, sbStart,"");
}else{
getAllPersonSonInfoAllById(sonId, sonName, sonPeerage, sbStart,",");
}
}
sbStart.append("]}");
}else
sbStart.append("}");
}
2.html页面
<!DOCTYPE html>
<html style="height: 100%">
<head>
<meta charset="utf-8">
</head>
<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%"></div>
<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-gl/echarts-gl.min.js"></script>
<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-stat/ecStat.min.js"></script>
<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/dataTool.min.js"></script>
<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/china.js"></script>
<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/world.js"></script>
<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/bmap.min.js"></script>
<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/simplex.js"></script>
<script type="text/javascript">
var dom = document.getElementById("container");
var myChart = echarts.init(dom);
var app = {};
option = null;
myChart.showLoading();
var data1 = ${relationAll!};
var data2 = ${relationPage!};
myChart.hideLoading();
myChart.setOption(option = {
tooltip: {
trigger: 'item',
triggerOn: 'mousemove'
},
legend: {
top: '2%',
left: '3%',
orient: 'vertical',
data: [{
name: '全部族谱',
icon: 'rectangle'
} ,
{
name: '部分族谱',
icon: 'rectangle'
}],
borderColor: '#c23531'
},
series:[
{
type: 'tree',
name: '全部族谱',
data: [data1],
top: '5%',
left: '7%',
bottom: '2%',
right: '34%',
symbolSize: 7,
label: {
normal: {
position: 'left',
verticalAlign: 'middle',
align: 'right'
}
},
leaves: {
label: {
normal: {
position: 'right',
verticalAlign: 'middle',
align: 'left'
}
}
},
expandAndCollapse: true,
animationDuration: 550,
animationDurationUpdate: 750
},
{
type: 'tree',
name: '部分族谱',
data: [data2],
top: '20%',
left: '80%',
bottom: '22%',
right: '10%',
symbolSize: 7,
label: {
normal: {
position: 'left',
verticalAlign: 'middle',
align: 'right'
}
},
leaves: {
label: {
normal: {
position: 'right',
verticalAlign: 'middle',
align: 'left'
}
}
},
expandAndCollapse: true,
animationDuration: 550,
animationDurationUpdate: 750
}
]
});
;
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
</script>
</body>
</html>
标签：遍历,obj,String,递归,家谱,sbStart,left,append,name 来源： https://blog.csdn.net/weixin_40931184/article/details/88890499
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。