ing
This commit is contained in:
parent
a6277fba90
commit
33da27c26c
|
@ -16,19 +16,15 @@
|
|||
|
||||
<div *ngIf="!showIntro" class="vis-container">
|
||||
<svg #discoveryTarget width="100%" height="100%">
|
||||
<defs>
|
||||
<pattern id="icon_db_maria" width="1" height="1" patternUnits="objectBoundingBox">
|
||||
<image x="0" y="0" width="66" height="56" xlink:href="../../assets/image/icon/icon_db_maria.svg"></image>
|
||||
</pattern>
|
||||
</defs>
|
||||
<g>
|
||||
<g *ngFor="let link of links">
|
||||
<line class="link" [attr.x1]="link.source.x" [attr.y1]="link.source.y" [attr.x2]="link.target.x" [attr.y2]="link.target.y"></line>
|
||||
</g>
|
||||
<g *ngFor="let node of nodes">
|
||||
<g class="node-container" [attr.transform]="'translate(' + node.x + ',' + node.y + ')'" (click)="onTargetClick(node)">
|
||||
<circle class="node" cx="0" cy="0" r="33" fill="url(#icon_db_maria)"></circle>
|
||||
<text class="textClass" y="2.5em" text-anchor="middle">{{node.id}}</text>
|
||||
<!-- <circle class="node" cx="0" cy="0" [attr.r]="node.r" fill="url(#icon_db_maria)"></circle> -->
|
||||
<image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2" xlink:href="../../assets/image/icon/icon_db_maria.svg"></image>
|
||||
<text class="textClass" [attr.y]="(node.r - 10) / 10 + 'em'" text-anchor="middle">{{node.id}}</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
|
|
|
@ -127,7 +127,7 @@ export class HomePageComponent implements OnInit, OnDestroy {
|
|||
this.links = [];
|
||||
|
||||
this.nodes.push(
|
||||
{ id: '192.168.1.0/24', group: 'zone', target: this.zone, fx: width / 2, fy: height / 2 },
|
||||
{ id: '192.168.1.0/24', group: 'zone', target: this.zone, fx: width / 2, fy: height / 2, r: 60 },
|
||||
// { id: '192.168.1.1' },
|
||||
// { id: '192.168.1.2' },
|
||||
);
|
||||
|
@ -139,7 +139,7 @@ export class HomePageComponent implements OnInit, OnDestroy {
|
|||
|
||||
this.simulationRestart();
|
||||
|
||||
// this.probeService.send('DiscoveryService.DiscoverHost', requesterID, this.zone, this.discoverHost);
|
||||
this.probeService.send('DiscoveryService.DiscoverHost', requesterID, this.zone, this.discoverHost);
|
||||
|
||||
// this.probeService.send(
|
||||
// 'DiscoveryService.DiscoverHost',
|
||||
|
@ -288,7 +288,7 @@ export class HomePageComponent implements OnInit, OnDestroy {
|
|||
console.log('DiscoveredHost', host);
|
||||
const hostId = `${host.address}`;
|
||||
const zoneNode = this.getNode('192.168.1.0/24');
|
||||
const hostNode = new Node(hostId, 'host', host);
|
||||
const hostNode = new Node(hostId, 'host', host, 40);
|
||||
hostNode.x = zoneNode.x;
|
||||
hostNode.y = zoneNode.y;
|
||||
|
||||
|
@ -315,7 +315,7 @@ export class HomePageComponent implements OnInit, OnDestroy {
|
|||
const serviceId = `${service.port.host.address}-${service.port.portNumber}-${service.key}`;
|
||||
|
||||
const hostNode = this.getNode(hostId);
|
||||
const serviceNode = new Node(serviceId, 'service', service);
|
||||
const serviceNode = new Node(serviceId, 'service', service, 30);
|
||||
serviceNode.x = hostNode.x;
|
||||
serviceNode.y = hostNode.y;
|
||||
|
||||
|
|
|
@ -40,11 +40,15 @@ export class Node implements d3.SimulationNodeDatum {
|
|||
|
||||
image?: string;
|
||||
|
||||
constructor(id, group, target) {
|
||||
constructor(id, group, target, r?) {
|
||||
this.id = id;
|
||||
this.group = group;
|
||||
this.target = target;
|
||||
this.r = 50;
|
||||
if (undefined === r) {
|
||||
this.r = 20;
|
||||
} else {
|
||||
this.r = r;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue
Block a user