overflow_scanner/app
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ing

Browse Source
This commit is contained in:
crusader 2018-09-13 16:11:30 +09:00
parent b4307ef25e
commit dc5ad26d73
3 changed files with 28 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/pages/home/home-page.component.html
View File

@ -14,7 +14,7 @@
</div> </div>
<div *ngIf="!showIntro" class="vis-container"> <div *ngIf="!showIntro" class="discovery-container">
<svg #discoveryTarget width="100%" height="100%"> <svg #discoveryTarget width="100%" height="100%">
<g> <g>
<g *ngFor="let link of links"> <g *ngFor="let link of links">

2
src/app/pages/home/home-page.component.scss
View File

@ -42,7 +42,7 @@
} }
} }
.vis-container { .discovery-container {
height: 100vh; height: 100vh;
margin: -0.6em -0.9em -0.7em -0.9em; //-0.5em -0.75em; margin: -0.6em -0.9em -0.7em -0.9em; //-0.5em -0.75em;
padding: 0; padding: 0;

39
src/app/pages/home/home-page.component.ts
View File

@ -1,5 +1,5 @@
import { Component, OnInit, OnDestroy, ViewChild, ElementRef, ChangeDetectorRef } from '@angular/core'; import { Component, OnInit, OnDestroy, ViewChild, ElementRef, ChangeDetectorRef, HostListener } from '@angular/core';
import { ProbeService, requesterID } from '../../../commons/service/probe.service'; import { ProbeService, requesterID } from '../../../commons/service/probe.service';
@ -28,10 +28,6 @@ export class HomePageComponent implements OnInit, OnDestroy {
zone: Zone; zone: Zone;
discoverHost: DiscoverHost; discoverHost: DiscoverHost;
@ViewChild('discoveryTarget') set discoveryTarget(content: ElementRef) {
this.discoveryTargetRef = content;
}
blockedPanel = false; blockedPanel = false;
displaySidebar = false; displaySidebar = false;
@ -44,10 +40,29 @@ export class HomePageComponent implements OnInit, OnDestroy {
private nodes: Node[]; private nodes: Node[];
private links: Link[]; private links: Link[];
public simulation: d3.Simulation<Node, Link> | undefined; public simulation: d3.Simulation<Node, Link> | undefined;
private discoveryContainerWidth: number;
private discoveryContainerHeight: number;
hosts: Host[]; hosts: Host[];
ports: Port[]; ports: Port[];
@HostListener('window:resize', ['$event'])
onResize(event) {
if (undefined !== this.discoveryTargetRef) {
this.discoveryContainerWidth = this.discoveryTargetRef.nativeElement.clientWidth;
this.discoveryContainerHeight = this.discoveryTargetRef.nativeElement.clientHeight;
this.zoneNode.fx = this.discoveryContainerWidth / 2;
this.zoneNode.fy = this.discoveryContainerHeight / 2;
this.simulationRestart(false);
}
}
@ViewChild('discoveryTarget') set discoveryTarget(content: ElementRef) {
this.discoveryTargetRef = content;
}
constructor( constructor(
private changeDetector: ChangeDetectorRef, private changeDetector: ChangeDetectorRef,
private probeService: ProbeService, private probeService: ProbeService,
@ -119,8 +134,8 @@ export class HomePageComponent implements OnInit, OnDestroy {
this.showIntro = false; this.showIntro = false;
this.changeDetector.detectChanges(); this.changeDetector.detectChanges();
const width = this.discoveryTargetRef.nativeElement.clientWidth; this.discoveryContainerWidth = this.discoveryTargetRef.nativeElement.clientWidth;
const height = this.discoveryTargetRef.nativeElement.clientHeight; this.discoveryContainerHeight = this.discoveryTargetRef.nativeElement.clientHeight;
this.simulationInit(); this.simulationInit();
@ -130,8 +145,8 @@ export class HomePageComponent implements OnInit, OnDestroy {
this.zoneNode = new Node('192.168.1.0/24'); this.zoneNode = new Node('192.168.1.0/24');
this.zoneNode.group = 'zone'; this.zoneNode.group = 'zone';
this.zoneNode.target = this.zone; this.zoneNode.target = this.zone;
this.zoneNode.fx = width / 2; this.zoneNode.fx = this.discoveryContainerWidth / 2;
this.zoneNode.fy = height / 2; this.zoneNode.fy = this.discoveryContainerHeight / 2;
this.zoneNode.r = 60; this.zoneNode.r = 60;
// const hostNode = new Node('192.168.1.1'); // const hostNode = new Node('192.168.1.1');
@ -248,9 +263,6 @@ export class HomePageComponent implements OnInit, OnDestroy {
return; return;
} }
const width = this.discoveryTargetRef.nativeElement.clientWidth;
const height = this.discoveryTargetRef.nativeElement.clientHeight;
const svg = d3.select(this.discoveryTargetRef.nativeElement); const svg = d3.select(this.discoveryTargetRef.nativeElement);
const _zoom = d3.zoom().on('zoom', () => { const _zoom = d3.zoom().on('zoom', () => {
@ -265,7 +277,7 @@ export class HomePageComponent implements OnInit, OnDestroy {
.nodes(this.nodes) .nodes(this.nodes)
.force('charge', d3.forceManyBody().strength(-200)) .force('charge', d3.forceManyBody().strength(-200))
.force('link', d3.forceLink(this.links).distance(150)) .force('link', d3.forceLink(this.links).distance(150))
.force('center', d3.forceCenter(width / 2, height / 2)) .force('center', d3.forceCenter(this.discoveryContainerWidth / 2, this.discoveryContainerHeight / 2))
.force('collision', d3.forceCollide().radius(function (node: Node) { .force('collision', d3.forceCollide().radius(function (node: Node) {
return node.r * 1.2; return node.r * 1.2;
})) }))
@ -280,6 +292,7 @@ export class HomePageComponent implements OnInit, OnDestroy {
this.simulation this.simulation
.nodes(this.nodes) .nodes(this.nodes)
.force('link', d3.forceLink(this.links).distance(150)) .force('link', d3.forceLink(this.links).distance(150))
.force('center', d3.forceCenter(this.discoveryContainerWidth / 2, this.discoveryContainerHeight / 2))
.alpha(1) .alpha(1)
.restart() .restart()
; ;