我能够使用echart属性以树状结构显示数据库中的数据,但是现在我需要从数据库中动态显示树的每个节点上的图像。
表中有子级和父级关系,图像存储在数据库中。我正在尝试按父子数据查看数据,但未这样做。
Java Spring启动代码
@GetMapping("treeBuild2")
public List < UserParentId > tree() {
List < UserParentId > tree = new ArrayList < > ();
try {
Class.forName("com.mysql.cj.jdbc.Driver");
Connection con = DriverManager.getConnection("jdbc:mysql://192.168.1.30:3306/db_mlm", "root", "root");
Statement stmt = con.createStatement();
String call = ("{call gettree(1)}");
CallableStatement stmt1 = con.prepareCall(call);
stmt1.execute();
ResultSet rs = stmt1.getResultSet();
System.out.println("call->" + call);
while (rs.next()) {
UserParentId up = new UserParentId();
up.setId(rs.getInt("id"));
up.setParent_id(rs.getInt("parent_id1"));
up.setName(rs.getString("FirstName"));
up.setLvl(rs.getInt("lvl"));
tree.add(up);
}
// gettree method
@GetMapping("tree")
public List < client > getTree() {
List < client > myList = new ArrayList < > ();
try {
Class.forName("com.mysql.cj.jdbc.Driver");
Connection con = DriverManager.getConnection("jdbc:mysql://192.168.2.15:3306/sonoo", "root", "root");
Statement stmt = con.createStatement();
ResultSet rs = stmt.executeQuery("select * from Category");
while (rs.next()) {
client c = new client();
c.setTreeId(rs.getInt(1));
c.setTreeName(rs.getString(2));
c.setPerentId(rs.getInt(3));
myList.add(c);
System.out.println(rs.getInt(1));
System.out.println(rs.getString(2));
}
con.close();
} catch (Exception e) {
System.out.println(e);
}
System.out.println(myList);
for (int i = 1; i <= myList.size(); i++) {
System.out.println();
}
return myList;
}
con.close();
} catch (Exception e) {
System.out.println(e);
}
System.out.println(tree.toString());
return tree;
}
我尝试在与MYSQL数据库连接的后端中使用Spring Boot。
前端角度代码。
this._httpClient.get(this.baseurl+"treeBuild2").subscribe(
(res:any) => {
if(res){
this.list = res;
console.log(res);
this.r = this.convert(this.list);
this.jsonArray = JSON.parse(JSON.stringify(this.r));
this.str = JSON.stringify(this.r);
console.log(this.jsonArray);
})
//called convert function on data
convert(array):any{
var map = {};
for(var i = 0; i < array.length; i++){
var obj = array[i];
obj.children= [];
map[obj.id] = obj;
var parent = obj.parent_id || '-';
if(!map[parent]){
map[parent] = {
children: []
};
}
map[parent].children.push(obj);
}
return map['-'].children;
}