OrgChart icon indicating copy to clipboard operation
OrgChart copied to clipboard

How to count child from each parents?

Open stevenwilliam opened this issue 4 years ago • 3 comments

Hi all,

Could you tell me any reference how to count child from each parents? included grandchild and grandchild and soon, ^^

tx, Steven

stevenwilliam avatar Apr 09 '20 20:04 stevenwilliam

Hello,

this sounds to me like a "normal" JSON-issue. I would probably iterate through the JSON. Something like this.

for (i in data.children) 
{
	title1 = data.children[i].title

	for (j in data.children[i].children) 
	{
		title2 = data.children[i].children[j].title
		// [... and so on]
	}
}

msteudtn avatar Apr 23 '20 06:04 msteudtn

Not sure if this will be helpful to anyone but I was able to do it by editing the js file createNode function.

You can add something like this to add a span with the count of child elements :

if (data.children !== undefined && data.children !== null) { $nodeDiv.append(<span>${data.children.length}</span>); }

Here it is with some of the other code in the function.

        // construct the content of node
            var $nodeDiv = $('<div' + (opts.draggable ? ' draggable="true"' : '') + (data[opts.nodeId] ? ' id="' + data[opts.nodeId] + '"' : '') + (data.parentId ? ' data-parent="' + data.parentId + '"' : '') + '>')
                .addClass('node ' + (data.className || '') + (level > opts.visibleLevel ? ' slide-up' : ''));
            if (opts.nodeTemplate) {
                if (data.children !== undefined && data.children !== null) {
                    $nodeDiv.append(<span>${data.children.length}</span>);
                }

stevenrlp avatar Apr 07 '21 19:04 stevenrlp

add this following to the else clause: (data.children !== undefined && data.children !== null ? '&nbsp;&#40;<b>'+ data.children.length +'</b>&#41;' : '')

the construct of the content of node looks like: // construct the content of node var $nodeDiv = $('<div' + (opts.draggable ? ' draggable="true"' : '') + (data[opts.nodeId] ? ' id="' + data[opts.nodeId] + '"' : '') + (data.parentId ? ' data-parent="' + data.parentId + '"' : '') + '>') .addClass('node ' + (data.className || '') + (level > opts.visibleLevel ? ' slide-up' : '')); if (opts.nodeTemplate) { $nodeDiv.append(opts.nodeTemplate(data)); } else { $nodeDiv.append('<div class="title">' + data[opts.nodeTitle] + '</div>') .append(typeof opts.nodeContent !== 'undefined' ? '<div class="content">' + (data[opts.nodeContent] || '') + (data.children !== undefined && data.children !== null ? '&nbsp;&#40;<b>'+ data.children.length +'</b>&#41;' : '') + '</div>' : ''); }

meilao3rd avatar Mar 09 '23 14:03 meilao3rd