d3.js: Expand multiple paths in tree layout

旧街凉风 提交于 2019-12-12 16:53:36

问题


My JSON contains same node names in different paths, I would like to be able to open all children with the same name or has substring in their names.

Tried this example: [Search Collapsible Tree], but it opens only one path.
The idea is to implement search for substring and a if a path has a node that contains the search term, then, open (expand) that path.

So, I replaced the Select2 to text input but the search is still limited to one result.


回答1:


You just need to change tree search function to find all the nodes (and then, highlight everything):

	function searchTree(obj,search,path, paths){
		if(obj.name.indexOf(search) != -1){ //if search is found return, add the object to the path and return it
			path.push(obj);
			paths.push(path.slice(0)); // clone array
		}
		else if(obj.children || obj._children){ //if children are collapsed d3 object will have them instantiated as _children
			var children = (obj.children) ? obj.children : obj._children;
			for(var i=0;i<children.length;i++){
				path.push(obj);// we assume this path is the right one			  
				searchTree(children[i],search,path, paths);
				path.pop();
			}
		}
	}

...

	$("#search").on("select2-selecting", function(e) {
		var paths = [];
		searchTree(root,e.object.text,[], paths);
		if(paths.length > 0)
		{
			paths.forEach(function(p) { openPaths(p) });
			//openPaths(paths);
		}
		else{
			alert(e.object.text+" not found!");
		}
	})


来源:https://stackoverflow.com/questions/39062545/d3-js-expand-multiple-paths-in-tree-layout

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!