The implementation of tree data (hierarchical relational data) in the Web--taking the District tree as an example (II.)

It has been implemented in Java to generate a borough tree (see blog), you can actually build a tree in JavaScript, because JavaScript is a weak type, in a way, JavaScript is easier than Java to build trees. In JavaScript, just generate ztree or ext tree supported data formats.

/** * Build tree, returns an array if the parameters passed in are multiple, and returns the root node if there is only one root node. *  * @param   nodes  {array}  tree node arrays, node format {id:1, parentid:null, text: ', children: [], leaf:true} * @return 
    returns the root node of the tree */function Buildtree (nodes) {//If the passed in parameter is not an array or an empty array, exit if (Object.prototype.toString.call)! = = ' [object Array] ' | | Nodes.length = = = 0) {return null;} var i, J, child, parent, hasparent,//node number len = nodes.length,//top-level node array, if there is only one top-level node, the array has only one element, and the top-level node is the root node. tops = [];//If there is only one node, the node is returned if (len = = = 1) {reutrn nodes[0];} For two rounds of traversal, the parent node of the construction tree and the child node for (i = 0; i < len; i++) {child = Nodes[i];hasparent = false;//If child does not have a parent node, then children is the top node if (! Child.parentid) {tops.add (child); continue;} for (j = 0; J < Len; J + +) {parent = nodes[j];if (Parent.id = = = Child.parentid) {//Add child nodes Parent.children.push (children);p arent . Leaf = False;hasparent = True;break;}} If child does not have a parent node, child is the top-level node if (!hasparent) {tops.add (child);}} If there is only one top-level node, the node is returned, otherwise the array is returned. return Tops.length = = = 1? Tops[0]: tops;}

The complete code for spanning the tree with JavaScript is as follows

Regional data var = [{"Code": 420000, "name": "Hubei Province", "Parentcode": 0},{"code": 420100, "name": "Wuhan", "Parentcode": 420000}, {"Code": 420101, "name": "District", "Parentcode": 420100},{"code": 420102, "name": "Jiang ' an", "Parentcode": 420100},{"code": 4201 "Name": "Jianghan District", "Parentcode": 420100},{"code": 420104, "name": "Qiaokou District", "Parentcode": 420100},{"code": 420105, "name": "Han Yang area "," Parentcode ": 420100},{" code ": 421000," name ":" Jinzhou "," Parentcode ": 420000},{" code ": 421001," name ":" District "," Parentc Ode ": 421000},{" code ": 421002," name ":" Shashi District "," Parentcode ": 421000},{" code ": 421003," name ":" Jinzhou District "," Parentcode ": 421000} , {"Code": 430000, "name": "Hunan Province", "Parentcode": 0},{"code": 430100, "name": "Changsha", "Parentcode": 430000},{"code": 430101, "  Name ":" District "," Parentcode ": 430100},{" code ": 430102," name ":" Furong "," Parentcode ": 430100},{" code ": 430103," name ":" Tianxin District ",  "Parentcode": 430100},{"code": 430104, "name": "Yuelu District", "Parentcode": 430100}];//turn the administrative data into a tree node so that the tree can be built var i, nodes = [];for (i = 0; i < data.length; i++){Nodes.push ({id:data[i].code,pid:data[i].parentcode,text:data[i].name,nodedata:data[i]});} Create the administrative district tree var root = buildtree (nodes);

Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.

The implementation of tree data (hierarchical relational data) in the Web--taking the District tree as an example (II.)