family-hierarchy
Version:
A small library for **Angular 9+** that implements [vis-network](https://github.com/visjs/vis-network) to generate a hierarchy chart of a family.
16 lines (14 loc) • 14.7 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("rxjs"),require("vis-network/standalone"),require("util"),require("@angular/common")):"function"==typeof define&&define.amd?define("family-hierarchy",["exports","@angular/core","rxjs","vis-network/standalone","util","@angular/common"],t):t((e=e||self)["family-hierarchy"]={},e.ng.core,e.rxjs,e["vis-network"],e["vis-util"],e.ng.common)}(this,(function(e,t,i,n,r,s){"use strict";
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */function o(e,t,i,n){var r,s=arguments.length,o=s<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(e,t,i,n);else for(var u=e.length-1;u>=0;u--)(r=e[u])&&(o=(s<3?r(o):s>3?r(t,i,o):r(t,i))||o);return s>3&&o&&Object.defineProperty(t,i,o),o}function u(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,r,s=i.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(n=s.next()).done;)o.push(n.value)}catch(e){r={error:e}}finally{try{n&&!n.done&&(i=s.return)&&i.call(s)}finally{if(r)throw r.error}}return o}function c(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(u(arguments[t]));return e}var a={interaction:{hover:!0,selectConnectedEdges:!1},layout:{hierarchical:{enabled:!0,levelSeparation:150,nodeSpacing:200,treeSpacing:200,blockShifting:!0,edgeMinimization:!0,parentCentralization:!0,direction:"UD",sortMethod:"directed",shakeTowards:"leaves"}},edges:{shadow:!0},nodes:{shadow:!0},physics:{maxVelocity:10,minVelocity:.1}},d={links:{childrens:{styles:{color:"#848484",highlight:"#848484",hover:"#848484"}},parents:{styles:{color:"#99004d",highlight:"#800040",hover:"#800040"}}},nodes:{images:"data:image/png;base64,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",size:20},union:{images:"data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE4LjEuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMzEuODkxIDMxLjg5MSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzEuODkxIDMxLjg5MTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZD0iTTMwLjU0Myw1Ljc0bC00LjA3OC00LjAzNWMtMS44MDUtMS43NzctNC43MzYtMS43ODktNi41NDUtMC4wMmwtNC41MjUsNC40MTRjLTEuODEyLDEuNzY4LTEuODIsNC42NDgtMC4wMiw2LjQyNA0KCQlsMi41ODYtMi40ODRjLTAuMjYyLTAuNzkxLDAuMDYxLTEuNjk3LDAuNzAxLTIuMzI0bDIuODc5LTIuODA3YzAuOTEyLTAuODg1LDIuMzc1LTAuODgxLDMuMjc1LDAuMDFsMi40NDksMi40Mg0KCQljMC45LDAuODkxLDAuODk2LDIuMzI2LTAuMDEsMy4yMTNsLTIuODc5LDIuODA5Yy0wLjYwOSwwLjU5NC0xLjYwOSwwLjkyLTIuMzg1LDAuNzExbC0yLjUzMywyLjQ4Ng0KCQljMS44MDMsMS43ODEsNC43MzIsMS43ODksNi41NDUsMC4wMmw0LjUyLTQuNDFDMzIuMzQsMTAuMzk2LDMyLjM0Niw3LjUxOSwzMC41NDMsNS43NHoiLz4NCgk8cGF0aCBkPSJNMTMuOTc1LDIxLjg5NGMwLjIxNSwwLjc3My0wLjEyOSwxLjc3My0wLjc1MiwyLjM4MWwtMi42ODksMi42MjdjLTAuOTIyLDAuOS0yLjQxNCwwLjg5NS0zLjMzMi0wLjAxMmwtMi40OTgtMi40NjENCgkJYy0wLjkxNi0wLjkwNi0wLjkxLTIuMzc5LDAuMDEyLTMuMjc1bDIuNjkxLTIuNjI3YzAuNjU2LTAuNjM3LDEuNTk4LTAuOTYxLDIuNDItMC42ODlsMi41OTQtMi41Nw0KCQljLTEuODM2LTEuODExLTQuODI0LTEuODItNi42NjgtMC4wMmwtNC4zNjMsNC4yNmMtMS44NDYsMS44MDMtMS44NTUsNC43MzQtMC4wMiw2LjU0OWw0LjE1NCw0LjEwNw0KCQljMS44MzQsMS44MDksNC44MiwxLjgxOCw2LjY2OCwwLjAxOGw0LjM2My00LjI2YzEuODQ0LTEuODA1LDEuODUyLTQuNzM0LDAuMDItNi41NDdMMTMuOTc1LDIxLjg5NHoiLz4NCgk8cGF0aCBkPSJNMTEuMTM5LDIwLjcyMmMwLjYxMSwwLjYxNywxLjYxMSwwLjYyMywyLjIzNCwwLjAwOGw3LjQ1NS03LjQxNmMwLjYyMS0wLjYxNywwLjYyNS0xLjYxNSwwLjAwOC0yLjIzNA0KCQljLTAuNjEzLTAuNjE1LTEuNjExLTAuNjE5LTIuMjMtMC4wMDZsLTcuNDU3LDcuNDE0QzEwLjUyOSwxOS4xMDMsMTAuNTI1LDIwLjEwMSwxMS4xMzksMjAuNzIyeiIvPg0KPC9nPg0KPC9zdmc+DQo=",size:20}},l=function(){function e(){this.currentEdges=new i.BehaviorSubject(new n.DataSet),this._Edges=this.currentEdges.asObservable(),this.currentNodes=new i.BehaviorSubject(new n.DataSet),this._Nodes=this.currentNodes.asObservable(),this.currentFhNodes=new i.BehaviorSubject([]),this._fhNodes=this.currentFhNodes.asObservable(),this.currentFhUnions=new i.BehaviorSubject([]),this._fhUnions=this.currentFhUnions.asObservable(),this.currentFhLinks=new i.BehaviorSubject([]),this._fhLinks=this.currentFhLinks.asObservable(),this.currentConfig=new i.BehaviorSubject(d),this._config=this.currentConfig.asObservable(),this.init=new i.Subject,this._init=this.init.asObservable(),this._clickNode=new i.Subject,this.clickNode=this._clickNode.asObservable(),this._clickUnion=new i.Subject,this.clickUnion=this._clickUnion.asObservable(),this._clickLink=new i.Subject,this.clickLink=this._clickLink.asObservable()}return Object.defineProperty(e.prototype,"Edges",{get:function(){return this._Edges},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"Nodes",{get:function(){return this._Nodes},enumerable:!0,configurable:!0}),e.prototype.setFhNodes=function(e){this.currentNodes.next(this.generateNodes(e)),this.currentFhNodes.next(e)},Object.defineProperty(e.prototype,"FhNodes",{get:function(){return this._fhNodes},enumerable:!0,configurable:!0}),e.prototype.setFhUnions=function(e){this.generateUnions(e),this.currentFhUnions.next(e)},Object.defineProperty(e.prototype,"FhUnions",{get:function(){return this._fhUnions},enumerable:!0,configurable:!0}),e.prototype.setFhLinks=function(e){this.currentEdges.next(this.generateEdges(e)),this.currentFhLinks.next(e)},Object.defineProperty(e.prototype,"FhLinks",{get:function(){return this._fhLinks},enumerable:!0,configurable:!0}),e.prototype.setConfig=function(e){this.currentConfig.next(this.mergeDeep(this.currentConfig.getValue(),e))},Object.defineProperty(e.prototype,"config",{get:function(){return this._config},enumerable:!0,configurable:!0}),e.prototype.sendClickEvent=function(e,t){if("node"===t){var i=this.currentFhNodes.getValue().find((function(t){return t.id===e.nodes[0]}));if(i)this._clickNode.next(i);else{var n=e.nodes[0].replace("u",""),r=this.currentFhUnions.getValue().find((function(e){return e.id==n}));this._clickUnion.next(r)}}else{var s=this.currentFhLinks.getValue().find((function(t){return t.id==e.edges[0]}));if(s)this._clickLink.next(s);else{var o=e.edges[0].toString().match(/(?<=l)(.*?)(?=_)/)[0];this._clickLink.next(this.currentFhUnions.getValue().find((function(e){return e.id==o})))}}},e.prototype.initialize=function(e,t){this.currentFhLinks.next(e.links),this.currentFhNodes.next(e.nodes),this.currentFhUnions.next(e.unions),this.currentEdges.next(this.generateEdges(e.links)),this.currentNodes.next(this.generateNodes(e.nodes)),this.generateUnions(e.unions),t&&this.setConfig(t),this.init.next(!0)},e.prototype.mergeDeep=function(e){for(var t,i,n=[],s=1;s<arguments.length;s++)n[s-1]=arguments[s];if(!n.length)return e;var o=n.shift();if(r.isObject(e)&&r.isObject(o))for(var u in o)r.isObject(o[u])?(e[u]?e[u]=Object.assign({},e[u]):Object.assign(e,((t={})[u]={},t)),this.mergeDeep(e[u],o[u])):Object.assign(e,((i={})[u]=o[u],i));return this.mergeDeep.apply(this,c([e],n))},e.prototype.generateNodes=function(e){var t=this;return new n.DataSet(e.map((function(e){return t.createNode(e)})))},e.prototype.createNode=function(e){return{id:e.id,image:e.image?e.image:this.currentConfig.getValue().nodes.images,shape:"image",size:this.currentConfig.getValue().nodes.size,level:2*e.level-1,label:e.label}},e.prototype.createEdge=function(e){return{id:e.id,from:e.nodeId,to:"u"+e.unionId,color:this.currentConfig.getValue().links.childrens.styles}},e.prototype.generateEdges=function(e){var t=this;return new n.DataSet(e.map((function(e){return t.createEdge(e)})))},e.prototype.generateUnions=function(e){var t=this;e.forEach((function(e){t.createUnion(e)}))},e.prototype.createUnion=function(e){var t,i=this,n={id:"u"+e.id,image:this.currentConfig.getValue().union.images,shape:"image",size:this.currentConfig.getValue().union.size};e.components.forEach((function(r){var s={id:"l"+e.id+"_"+n.id+"-"+r,from:n.id,to:r,color:i.currentConfig.getValue().links.parents.styles};t=i.currentFhNodes.getValue().filter((function(e){return e.id===r}))[0].level,i.currentEdges.getValue().add(s)})),n.level=2*t,this.currentNodes.getValue().add(n)},e.prototype.addNode=function(e){this.currentFhNodes.getValue().push(e),this.currentNodes.getValue().add(this.createNode(e))},e.prototype.addLink=function(e){this.currentFhLinks.getValue().push(e),this.currentEdges.getValue().add(this.createEdge(e))},e.prototype.addUnion=function(e){this.currentFhUnions.getValue().push(e),this.createUnion(e)},e.ɵprov=t.ɵɵdefineInjectable({factory:function(){return new e},token:e,providedIn:"root"}),e=o([t.Injectable({providedIn:"root"})],e)}(),h=function(){function e(e){this.familyService=e,this.class="",this.editMode=!1,this.subs=new i.Subscription}return e.prototype.ngOnInit=function(){},e.prototype.ngAfterViewInit=function(){var e=this,t=this.familyService._init.subscribe((function(t){e.createNetwork()}));this.subs.add(t),this.subs.add(this.familyService._config.subscribe((function(t){return e.config=t}))),this.subs.add(this.familyService.Edges.subscribe((function(t){return e.dsEdge=t}))),this.subs.add(this.familyService.Nodes.subscribe((function(t){return e.dsNode=t})))},e.prototype.createNetwork=function(){var e=this;this.visNetworkData={nodes:this.dsNode,edges:this.dsEdge},this.visNetwork=new n.Network(this.el.nativeElement,this.visNetworkData,a),this.visNetwork.on("selectNode",(function(t){e.familyService.sendClickEvent(t,"node")})),this.visNetwork.on("selectEdge",(function(t){e.familyService.sendClickEvent(t)}))},e.prototype.ngOnDestroy=function(){this.subs.unsubscribe()},e.ctorParameters=function(){return[{type:l}]},o([t.ViewChild("box")],e.prototype,"el",void 0),o([t.ContentChild("nodeTemplate")],e.prototype,"nodeTemplate",void 0),o([t.ViewChild("contentNode")],e.prototype,"contentNode",void 0),o([t.Input()],e.prototype,"class",void 0),o([t.Input()],e.prototype,"editMode",void 0),e=o([t.Component({selector:"FamilyHierarchy",template:'\x3c!-- <div class="vis-container"\r\n [visNetwork]="visNetwork"\r\n [visNetworkData]="visNetworkData"\r\n [visNetworkOptions]="visNetworkOptions"\r\n (initialized)="networkInitialized()">\r\n</div>\r\n --\x3e\r\n<div #box [class.edit-mode]="editMode" [ngClass]="[\'vis-container\', class]"></div>',styles:[".vis-container{width:100%;height:100%;outline:0}.edit-mode{background-size:40px 40px;background-image:linear-gradient(to right,grey 1px,transparent 1px),linear-gradient(to bottom,grey 1px,transparent 1px)}"]})],e)}(),g=function(){function e(){}return e=o([t.NgModule({declarations:[h],imports:[s.CommonModule],exports:[h]})],e)}();e.FamilyHierarchyComponent=h,e.FamilyHierarchyModule=g,e.FamilyHierarchyService=l,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=family-hierarchy.umd.min.js.map