From a3a8c23b196980732a795713a5eb5fe0c7075bf9 Mon Sep 17 00:00:00 2001 From: fengxiang <110431245@qq.com> Date: Wed, 11 Jul 2018 21:47:13 +0800 Subject: [PATCH] Revert "提交" --- src/app/routes/data-v/relation/relation.component.ts | 169 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 169 insertions(+), 0 deletions(-) diff --git a/src/app/routes/data-v/relation/relation.component.ts b/src/app/routes/data-v/relation/relation.component.ts new file mode 100644 index 0000000..a0fa4a7 --- /dev/null +++ b/src/app/routes/data-v/relation/relation.component.ts @@ -0,0 +1,169 @@ +import { Component, OnDestroy, ViewEncapsulation, OnInit } from '@angular/core'; +import { _HttpClient } from '@delon/theme'; + +@Component({ + selector: 'app-data-v-relation', + templateUrl: './relation.component.html', + styleUrls: ['./relation.component.less'], +}) +export class RelationComponent implements OnInit, OnDestroy { + ecIntance: any; + + options: any = { + title: { + text: 'User Releaction', + }, + tooltip: {}, + animationDurationUpdate: 1500, + animationEasingUpdate: 'quinticInOut', + series: [ + { + type: 'graph', + layout: 'force', + symbolSize: 60, + focusNodeAdjacency: true, + roam: true, + categories: [ + { + name: 'User', + }, + ], + label: { + normal: { + show: true, + textStyle: { + fontSize: 12, + }, + }, + }, + force: { + repulsion: 2000, + gravity: 0.3, + }, + edgeSymbol: ['circle', 'arrow'], + edgeSymbolSize: [4, 10], + draggable: true, + tooltip: { + triggerOn: 'click', + formatter: item => { + if (item.dataType === 'node') + return `${item.data.name}���${item.data.arg}`; + return item.name; + }, + }, + data: Array(20) + .fill({}) + .map((v, i) => { + return { + name: 'User' + i, + arg: i + 10, + category: 0, + }; + }), + links: [ + { + source: 'User0', + target: 'User1', + }, + { + source: 'User0', + target: 'User2', + }, + { + source: 'User0', + target: 'User3', + }, + { + source: 'User1', + target: 'User4', + }, + { + source: 'User2', + target: 'User5', + }, + { + source: 'User3', + target: 'User6', + }, + { + source: 'User4', + target: 'User7', + }, + { + source: 'User5', + target: 'User8', + }, + { + source: 'User6', + target: 'User9', + }, + { + source: 'User1', + target: 'User10', + }, + { + source: 'User1', + target: 'User11', + }, + { + source: 'User11', + target: 'User12', + }, + { + source: 'User11', + target: 'User13', + }, + { + source: 'User11', + target: 'User14', + }, + { + source: 'User11', + target: 'User15', + }, + { + source: 'User11', + target: 'User16', + }, + { + source: 'User11', + target: 'User17', + }, + { + source: 'User11', + target: 'User18', + }, + { + source: 'User11', + target: 'User19', + }, + ], + lineStyle: { + normal: { + opacity: 0.7, + width: 1, + curveness: 0.1, + }, + }, + }, + ], + }; + + constructor(private http: _HttpClient) {} + + chartInit(ec) { + this.ecIntance = ec; + } + + ngOnInit() { + window.addEventListener('resize', () => this.resize); + } + + private resize() { + if (this.ecIntance) this.ecIntance.resize(); + } + + ngOnDestroy(): void { + window.removeEventListener('resize', () => this.resize); + } +} -- Gitblit v1.8.0