This commit is contained in:
crusader 2018-09-11 21:05:09 +09:00
parent 405612a6ad
commit 467cc6caeb
3 changed files with 154 additions and 24 deletions

View File

@ -38,6 +38,9 @@
<image [attr.x]="-node.r" [attr.y]="-node.r" [attr.width]="node.r * 2" [attr.height]="node.r * 2"
attr.xlink:href="../../assets/image/logo/logo_{{node.target.osType | lowercase}}.svg"></image>
</g>
<g *ngIf="node.group === 'host' && node.target.deviceType !== 'HOST' && node.target.deviceVendor !== ''">
<text class="textClass" [attr.y]="(node.r - 30) / 10 + 'em'" text-anchor="middle">{{node.target.deviceVendor}}</text>
</g>
<g *ngIf="node.group === 'service'">
<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_was.svg"></image>

View File

@ -294,14 +294,21 @@ export class HomePageComponent implements OnInit, OnDestroy {
const hostId = `${host.address}`;
const zoneNode = this.getNode('192.168.1.0/24');
const hostNode = this.checkNode(hostId, host);
hostNode.group = 'host';
hostNode.r = 40;
hostNode.x = zoneNode.x;
hostNode.y = zoneNode.y;
let hostNode = this.getNode(hostId);
if (null !== hostNode) {
hostNode.target = host;
} else {
hostNode = new Node(hostId);
hostNode.target = host;
hostNode.group = 'host';
hostNode.r = 40;
hostNode.x = zoneNode.x;
hostNode.y = zoneNode.y;
this.nodes.push(hostNode);
this.links.push(new Link(zoneNode, hostNode));
}
this.nodes.push(hostNode);
this.links.push(new Link(zoneNode, hostNode));
this.simulationRestart();
}
@ -323,28 +330,34 @@ export class HomePageComponent implements OnInit, OnDestroy {
const serviceId = `${service.port.host.address}-${service.port.portNumber}-${service.key}`;
const hostNode = this.getNode(hostId);
const serviceNode = this.checkNode(serviceId, service);
serviceNode.group = 'service';
serviceNode.r = 30;
serviceNode.x = hostNode.x;
serviceNode.y = hostNode.y;
let serviceNode = this.getNode(serviceId);
if (null !== serviceNode) {
serviceNode.target = service;
} else {
serviceNode = new Node(serviceId);
serviceNode.target = service;
serviceNode.group = 'service';
serviceNode.r = 30;
serviceNode.x = hostNode.x;
serviceNode.y = hostNode.y;
this.nodes.push(serviceNode);
this.links.push(new Link(hostNode, serviceNode));
this.nodes.push(serviceNode);
this.links.push(new Link(hostNode, serviceNode));
}
this.simulationRestart();
}
private checkNode(id: string, target: any): Node {
let node = this.getNode(id);
if (null === node) {
node = new Node(id);
node.target = target;
} else {
node.target = target;
}
return node;
}
// private checkNode(id: string, target: any): Node {
// let node = this.getNode(id);
// if (null === node) {
// node = new Node(id);
// node.target = target;
// } else {
// node.target = target;
// }
// return node;
// }
private getNode(id: string): Node | null {
let _n: Node = null;

View File

@ -0,0 +1,114 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
version="1.1"
id="svg3104"
height="79.839996"
width="300">
<defs
id="defs3106" />
<metadata
id="metadata3109">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
<g
transform="translate(-311.04693,-470.39655)"
id="layer1">
<g
id="g3051"
transform="matrix(2.9861316,0,0,-2.9861316,195.28107,2130.6265)">
<g
id="g12"
transform="translate(39.4376,541.665)">
<path
d="m 0,0 3.45,0.323 c 0.213,-1.158 0.635,-2.012 1.27,-2.558 0.638,-0.542 1.5,-0.812 2.583,-0.812 1.144,0 2.008,0.245 2.595,0.726 0.58,0.492 0.867,1.053 0.867,1.695 0,0.417 -0.123,0.78 -0.364,1.072 C 10.156,0.733 9.73,0.993 9.124,1.199 8.705,1.359 7.757,1.614 6.28,1.989 4.375,2.458 3.037,3.045 2.276,3.734 1.196,4.714 0.654,5.908 0.654,7.306 c 0,0.9 0.249,1.751 0.765,2.527 0.506,0.788 1.244,1.387 2.205,1.803 0.958,0.4 2.105,0.609 3.472,0.609 2.209,0 3.872,-0.489 4.994,-1.461 1.119,-0.99 1.702,-2.289 1.757,-3.919 L 10.275,6.745 C 10.117,7.635 9.801,8.291 9.295,8.693 8.799,9.092 8.048,9.292 7.054,9.292 6.023,9.292 5.213,9.08 4.633,8.648 4.253,8.37 4.066,8.013 4.066,7.557 4.066,7.132 4.24,6.782 4.594,6.483 5.039,6.097 6.132,5.704 7.86,5.3 9.592,4.888 10.868,4.462 11.694,4.021 12.522,3.58 13.173,2.979 13.641,2.212 c 0.464,-0.748 0.706,-1.704 0.706,-2.827 0,-1.012 -0.284,-1.97 -0.845,-2.851 -0.561,-0.881 -1.357,-1.547 -2.382,-1.98 -1.029,-0.421 -2.308,-0.646 -3.84,-0.646 -2.231,0 -3.949,0.521 -5.143,1.564 C 0.945,-3.491 0.232,-1.98 0,0"
style="fill:#a7a5a6;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path14" />
</g>
<g
id="g16"
transform="translate(53.3329,548.733)">
<path
d="M 0,0 3.582,0 6.642,-9.109 9.624,0 13.115,0 8.628,-12.336 7.806,-14.587 c -0.297,-0.751 -0.577,-1.32 -0.845,-1.714 -0.268,-0.402 -0.577,-0.726 -0.925,-0.967 -0.355,-0.239 -0.784,-0.432 -1.284,-0.569 -0.512,-0.139 -1.086,-0.216 -1.728,-0.216 -0.647,0 -1.286,0.077 -1.915,0.216 l -0.28,2.665 c 0.525,-0.111 1.002,-0.166 1.425,-0.166 0.78,0 1.361,0.23 1.734,0.689 0.377,0.472 0.665,1.068 0.864,1.782 L 0,0 z"
style="fill:#a7a5a6;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path18" />
</g>
<g
id="g20"
transform="translate(78.1938,535.901)">
<path
d="m 0,0 -3.373,0 0,6.532 c 0,1.376 -0.07,2.263 -0.219,2.673 -0.148,0.405 -0.377,0.721 -0.709,0.947 -0.326,0.223 -0.726,0.336 -1.183,0.336 -0.593,0 -1.119,-0.164 -1.593,-0.487 C -7.551,9.682 -7.87,9.259 -8.044,8.737 -8.215,8.201 -8.305,7.228 -8.305,5.791 l 0,-5.791 -3.366,0 0,12.832 3.118,0 0,-1.879 c 1.122,1.421 2.53,2.123 4.229,2.123 0.755,0 1.438,-0.138 2.061,-0.396 0.622,-0.278 1.096,-0.612 1.408,-1.035 0.317,-0.419 0.539,-0.893 0.665,-1.418 C -0.065,9.704 0,8.936 0,7.951 L 0,0 z"
style="fill:#a7a5a6;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path22" />
</g>
<g
id="g24"
transform="translate(81.6659,542.281)">
<path
d="M 0,0 C 0,-1.281 0.3,-2.26 0.909,-2.924 1.516,-3.609 2.26,-3.95 3.15,-3.95 c 0.89,0 1.635,0.341 2.241,1.026 0.596,0.664 0.896,1.654 0.896,2.94 0,1.268 -0.3,2.237 -0.896,2.908 C 4.785,3.595 4.04,3.943 3.15,3.943 2.26,3.943 1.516,3.595 0.909,2.924 0.3,2.253 0,1.273 0,0 m -3.453,0.171 c 0,1.138 0.281,2.218 0.835,3.279 0.554,1.051 1.341,1.857 2.36,2.417 1.019,0.557 2.157,0.828 3.411,0.828 1.944,0 3.531,-0.628 4.768,-1.888 1.241,-1.261 1.864,-2.854 1.864,-4.775 0,-1.941 -0.628,-3.543 -1.88,-4.822 -1.25,-1.272 -2.83,-1.919 -4.729,-1.919 -1.174,0 -2.293,0.271 -3.363,0.802 -1.067,0.532 -1.877,1.31 -2.431,2.341 -0.554,1.02 -0.835,2.267 -0.835,3.737"
style="fill:#a7a5a6;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path26" />
</g>
<g
id="g28"
transform="translate(95.59,555.312)">
<path
d="m 0,0 0,-16.567 c 0,-0.79 0.058,-1.313 0.169,-1.563 0.116,-0.262 0.289,-0.455 0.524,-0.586 0.239,-0.131 0.681,-0.199 1.319,-0.199 l 0,-0.496 -6.122,0 0,0.496 c 0.574,0 0.964,0.059 1.184,0.184 0.202,0.123 0.366,0.31 0.485,0.587 0.12,0.271 0.175,0.796 0.175,1.577 l 0,11.305 c 0,1.423 -0.029,2.293 -0.09,2.622 -0.058,0.326 -0.162,0.544 -0.297,0.66 -0.139,0.123 -0.312,0.191 -0.523,0.191 -0.228,0 -0.522,-0.084 -0.873,-0.223 L -4.282,-1.527 -0.605,0 0,0 z"
style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path30" />
</g>
<g
id="g32"
transform="translate(103.261,547.855)">
<path
d="m 0,0 c -0.484,0 -0.967,-0.125 -1.454,-0.419 -0.487,-0.289 -0.883,-0.783 -1.184,-1.493 -0.299,-0.724 -0.45,-1.64 -0.45,-2.764 0,-1.817 0.367,-3.366 1.085,-4.693 0.726,-1.304 1.677,-1.969 2.857,-1.969 0.89,0 1.615,0.372 2.183,1.09 0.577,0.724 0.865,1.969 0.865,3.742 0,2.216 -0.478,3.947 -1.433,5.22 C 1.822,-0.421 0.999,0 0,0 m 0.419,0.919 c 1.899,0 3.418,-0.719 4.568,-2.157 0.974,-1.225 1.461,-2.633 1.461,-4.223 0,-1.122 -0.264,-2.254 -0.803,-3.394 -0.539,-1.144 -1.277,-2.009 -2.225,-2.589 -0.944,-0.583 -1.989,-0.874 -3.146,-0.874 -1.892,0 -3.392,0.751 -4.501,2.246 -0.938,1.26 -1.409,2.68 -1.409,4.257 0,1.148 0.284,2.279 0.851,3.405 0.575,1.14 1.322,1.969 2.254,2.524 0.929,0.532 1.912,0.805 2.95,0.805"
style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path34" />
</g>
<g
id="g36"
transform="translate(114.826,548.085)">
<path
d="m 0,0 c -0.671,0 -1.225,-0.28 -1.681,-0.813 -0.45,-0.532 -0.673,-1.331 -0.673,-2.437 0,-1.424 0.306,-2.528 0.919,-3.318 0.473,-0.594 1.064,-0.891 1.783,-0.891 0.686,0 1.254,0.263 1.692,0.777 0.442,0.515 0.661,1.317 0.661,2.413 0,1.442 -0.306,2.56 -0.928,3.37 C 1.305,-0.31 0.718,0 0,0 m -2.489,-12.184 c -0.416,-0.45 -0.726,-0.883 -0.942,-1.29 -0.216,-0.38 -0.316,-0.753 -0.316,-1.078 0,-0.447 0.258,-0.82 0.784,-1.146 0.909,-0.555 2.221,-0.844 3.934,-0.844 1.63,0 2.829,0.289 3.61,0.863 0.78,0.568 1.164,1.176 1.164,1.825 0,0.461 -0.232,0.796 -0.697,0.996 -0.474,0.201 -1.408,0.317 -2.815,0.346 -2.046,0.061 -3.624,0.18 -4.722,0.328 m 0.112,4.581 c -0.76,0.387 -1.338,0.896 -1.75,1.563 -0.403,0.675 -0.607,1.407 -0.607,2.21 0,1.238 0.459,2.306 1.387,3.182 0.932,0.889 2.125,1.338 3.576,1.338 1.185,0 2.214,-0.28 3.084,-0.864 l 2.642,0 c 0.393,0 0.618,-0.013 0.686,-0.035 C 6.7,-0.239 6.74,-0.28 6.773,-0.325 6.825,-0.41 6.856,-0.555 6.856,-0.761 6.856,-0.999 6.831,-1.174 6.786,-1.257 6.758,-1.303 6.712,-1.345 6.641,-1.363 6.573,-1.39 6.348,-1.402 5.951,-1.402 l -1.628,0 c 0.516,-0.657 0.771,-1.497 0.771,-2.519 0,-1.16 -0.451,-2.162 -1.336,-2.985 -0.89,-0.829 -2.082,-1.248 -3.571,-1.248 -0.619,0 -1.249,0.091 -1.896,0.294 -0.38,-0.358 -0.639,-0.656 -0.767,-0.915 -0.139,-0.266 -0.207,-0.482 -0.207,-0.657 0,-0.167 0.074,-0.31 0.229,-0.463 0.145,-0.141 0.442,-0.248 0.877,-0.307 0.248,-0.047 0.89,-0.082 1.902,-0.111 1.866,-0.059 3.079,-0.13 3.627,-0.223 0.845,-0.117 1.522,-0.435 2.025,-0.936 0.503,-0.505 0.754,-1.122 0.754,-1.859 0,-1.013 -0.483,-1.978 -1.443,-2.87 -1.407,-1.313 -3.251,-1.971 -5.524,-1.971 -1.747,0 -3.224,0.385 -4.429,1.175 -0.681,0.455 -1.016,0.922 -1.016,1.416 0,0.209 0.049,0.432 0.142,0.65 0.151,0.342 0.464,0.79 0.934,1.391 0.062,0.086 0.52,0.573 1.361,1.465 -0.468,0.294 -0.802,0.542 -0.992,0.772 -0.195,0.223 -0.294,0.48 -0.294,0.759 0,0.324 0.125,0.695 0.38,1.12 0.258,0.435 0.851,1.047 1.773,1.821"
style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path38" />
</g>
<g
id="g40"
transform="translate(122.069,548.41)">
<path
d="m 0,0 5.845,0 0,-0.5 -0.283,0 c -0.413,0 -0.719,-0.096 -0.925,-0.265 -0.204,-0.183 -0.303,-0.403 -0.303,-0.66 0,-0.362 0.145,-0.849 0.451,-1.474 l 3.047,-6.322 2.789,6.907 c 0.154,0.38 0.232,0.744 0.232,1.121 0,0.162 -0.039,0.281 -0.096,0.361 -0.075,0.097 -0.188,0.183 -0.343,0.236 C 10.262,-0.535 9.986,-0.5 9.599,-0.5 l 0,0.5 4.043,0 0,-0.5 c -0.336,-0.035 -0.596,-0.112 -0.777,-0.219 -0.185,-0.113 -0.384,-0.312 -0.6,-0.605 -0.084,-0.132 -0.246,-0.475 -0.468,-1.049 l -5.064,-12.46 c -0.494,-1.215 -1.139,-2.123 -1.941,-2.742 -0.8,-0.624 -1.571,-0.922 -2.312,-0.922 -0.539,0 -0.98,0.144 -1.332,0.462 -0.345,0.305 -0.518,0.658 -0.518,1.063 0,0.378 0.124,0.673 0.376,0.91 0.251,0.241 0.603,0.348 1.039,0.348 0.303,0 0.719,-0.098 1.238,-0.291 0.364,-0.125 0.596,-0.205 0.69,-0.205 0.274,0 0.567,0.148 0.896,0.428 0.322,0.278 0.648,0.822 0.974,1.623 l 0.883,2.176 -4.498,9.4 C 2.091,-2.298 1.871,-1.95 1.574,-1.528 1.345,-1.213 1.158,-0.997 1.013,-0.88 0.803,-0.744 0.464,-0.612 0,-0.5 L 0,0 z"
style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path42" />
</g>
<g
id="g44"
transform="translate(136.017,550.631)">
<path
d="M 0,0 0.705,0 C 0.854,0 0.974,0.009 1.057,0.052 1.144,0.07 1.206,0.132 1.25,0.197 1.299,0.269 1.319,0.346 1.319,0.426 1.319,0.539 1.277,0.635 1.189,0.713 1.106,0.788 0.97,0.826 0.79,0.826 L 0,0.826 0,0 z m -0.329,-1.393 0,2.502 1.099,0 c 0.223,0 0.39,-0.028 0.51,-0.08 C 1.4,0.988 1.482,0.91 1.554,0.803 1.625,0.681 1.656,0.555 1.656,0.426 1.656,0.242 1.602,0.093 1.482,-0.023 1.373,-0.148 1.196,-0.229 0.957,-0.261 1.048,-0.303 1.112,-0.348 1.154,-0.384 1.25,-0.471 1.341,-0.58 1.425,-0.709 l 0.435,-0.684 -0.41,0 -0.332,0.517 C 1.022,-0.735 0.941,-0.612 0.879,-0.535 0.812,-0.45 0.764,-0.4 0.712,-0.357 0.666,-0.328 0.616,-0.316 0.564,-0.3 0.526,-0.289 0.461,-0.283 0.376,-0.283 l -0.376,0 0,-1.11 -0.329,0 z"
style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
id="path46" />
</g>
<g
id="g48"
transform="translate(138.473,550.583)">
<path
d="m 0,0 c 0,-0.999 -0.813,-1.821 -1.809,-1.821 -1.003,0 -1.815,0.822 -1.815,1.821 0,1.006 0.812,1.812 1.815,1.812 C -0.813,1.812 0,1.006 0,0 z"
style="fill:none;stroke:#231f20;stroke-width:0.17900001;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
id="path50" />
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 10 KiB