ing
This commit is contained in:
parent
6f8f0e970c
commit
862977213b
|
@ -62,16 +62,26 @@ export class HomePageComponent implements OnInit, OnDestroy {
|
||||||
this.changeDetector.detectChanges();
|
this.changeDetector.detectChanges();
|
||||||
|
|
||||||
this.nodeSet = new vis.DataSet([
|
this.nodeSet = new vis.DataSet([
|
||||||
{ id: '192.168.1.0/24', label: 'Zone' },
|
{ id: '192.168.1.0/24', label: 'Zone', group: 'zone' },
|
||||||
]);
|
]);
|
||||||
this.edgeSet = new vis.DataSet([]);
|
this.edgeSet = new vis.DataSet([]);
|
||||||
|
|
||||||
const options = {
|
const options = {
|
||||||
width: '100%',
|
width: '100%',
|
||||||
height: '100%'
|
height: '100%',
|
||||||
|
groups: {
|
||||||
|
zone: { color: { background: 'red' }, borderWidth: 5 },
|
||||||
|
host: { color: { background: 'blue' }, borderWidth: 3 },
|
||||||
|
service: { color: { background: 'white' }, borderWidth: 1 },
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
this.visNetwork = new vis.Network(this.discoveryTargetRef.nativeElement, { nodes: this.nodeSet, edges: this.edgeSet }, options);
|
this.visNetwork = new vis.Network(this.discoveryTargetRef.nativeElement, { nodes: this.nodeSet, edges: this.edgeSet }, options);
|
||||||
|
this.visNetwork.on('click', (params) => {
|
||||||
|
const ids = params.nodes;
|
||||||
|
const clickedNodes = this.nodeSet.get(ids);
|
||||||
|
console.log('clicked nodes:', clickedNodes);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
const zone: Zone = {
|
const zone: Zone = {
|
||||||
|
@ -160,11 +170,11 @@ export class HomePageComponent implements OnInit, OnDestroy {
|
||||||
|
|
||||||
if (null !== this.nodeSet.get(hostId)) {
|
if (null !== this.nodeSet.get(hostId)) {
|
||||||
this.nodeSet.update([
|
this.nodeSet.update([
|
||||||
{ id: hostId, label: `${host.name}(${host.address})` }
|
{ id: hostId, label: `${host.name}(${host.address})`, group: 'host', host: host },
|
||||||
]);
|
]);
|
||||||
} else {
|
} else {
|
||||||
this.nodeSet.add([
|
this.nodeSet.add([
|
||||||
{ id: hostId, label: `${host.name}(${host.address})` }
|
{ id: hostId, label: `${host.name}(${host.address})`, group: 'host', host: host },
|
||||||
]);
|
]);
|
||||||
this.edgeSet.add([
|
this.edgeSet.add([
|
||||||
{ from: '192.168.1.0/24', to: hostId },
|
{ from: '192.168.1.0/24', to: hostId },
|
||||||
|
@ -190,10 +200,10 @@ export class HomePageComponent implements OnInit, OnDestroy {
|
||||||
const hostId = service.port.host.address;
|
const hostId = service.port.host.address;
|
||||||
const serviceId = `${service.port.host.address}-${service.port.portNumber}-${service.key}`;
|
const serviceId = `${service.port.host.address}-${service.port.portNumber}-${service.key}`;
|
||||||
this.nodeSet.add([
|
this.nodeSet.add([
|
||||||
{ id: `${serviceId}`, label: `${service.key}` }
|
{ id: `${serviceId}`, label: `${service.key}`, group: 'service', service: service }
|
||||||
]);
|
]);
|
||||||
this.edgeSet.add([
|
this.edgeSet.add([
|
||||||
{ from: `${hostId}`, to: `${serviceId}` },
|
{ from: `${hostId}`, label: `${service.port.portNumber}`, to: `${serviceId}` },
|
||||||
]);
|
]);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user