javascript - 搜索列表,只需要叶子

标签 javascript d3.js

我有来自 Patrick Brockmann's CollapsibleTree Search 的以下代码它用 D3 树节点填充 Select2 列表。我想改变这个,所以只有最后一个节点/叶子在列表中,而不是父节点。我该怎么做?

//===============================================
            function select2DataCollectName( d ) {
                if ( d.children )
                    d.children.forEach( select2DataCollectName );
                else if ( d._children )
                    d._children.forEach( select2DataCollectName );
                select2Data.push( d.name );
            }

            //===============================================
            function searchTree( d ) {
                if ( d.children )
                    d.children.forEach( searchTree );
                else if ( d._children )
                    d._children.forEach( searchTree );
                var searchFieldValue = eval( searchField );
                if ( searchFieldValue && searchFieldValue.match( searchText ) ) {
                    // Walk parent chain
                    var ancestors = [];
                    var parent = d;
                    while ( typeof ( parent ) !== "undefined" ) {
                        ancestors.push( parent );
                        //console.log(parent);
                        parent.class = "found";
                        parent = parent.parent;
                    }
                    //console.log(ancestors);
                }
            }
            //===============================================

    $( "#search" ).on( "select2-selecting", function ( e ) {
                clearAll( root );
                expandAll( root );
                update( root );
                searchField = "d.name";
                searchText = e.object.text;
                searchTree( root );
                root.children.forEach( collapseAllNotFound );
                update( root );
            } )

最佳答案

最好的想法是重构所有功能...

function select2DataCollectName(d) {
  if (d.children)
    d.children.forEach(select2DataCollectName);
  else if (d._children)
    d._children.forEach(select2DataCollectName);
  select2Data.push(d.name);
}

...避免不必要的递归。

但是,作为快速回答,您可以简单地检查对象中是否没有 children 属性:

if(!d.children) select2Data.push(d.name);

这是 fork 的 bl.ocks:http://bl.ocks.org/GerardoFurtado/75f9ac822aace4165caeca1708ee510d/2e24099a8f7d6157783f9d2099754d6abc085a93

关于javascript - 搜索列表,只需要叶子,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57519520/

相关文章:

javascript - 如何在 Windows 上检查 Meteor.js 的版本

javascript - javascript 的 promise 不会包含在另一个 promise 中吗?

javascript - Angular2 选择不起作用

javascript - 压缩 if 语句以查找值适合的范围

javascript - d3 缩放 : prevent page zoom when using a touchscreen

javascript - jQuery 返回 false 不起作用

javascript - GeoJson 和 D3.js 多面体

javascript - D3.js:组合缩放/画笔

javascript - 在 D3 树中,如何以编程方式关闭选定深度的所有节点(例如仅孙子节点)(无需单击节点)

d3.js - 更新刷面图的y轴