diff options
Diffstat (limited to 'usecaseui-portal/src')
-rw-r--r-- | usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.html | 7 | ||||
-rw-r--r-- | usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.ts | 27 |
2 files changed, 16 insertions, 18 deletions
diff --git a/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.html b/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.html index c0953a90..0a753a30 100644 --- a/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.html +++ b/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.html @@ -13,7 +13,7 @@ See the License for the specific language governing permissions and limitations under the License. --> -<!--<h3 class="title"> Services List </h3>--> + <div class="model creation-model"> <div class="top-title"> @@ -23,6 +23,7 @@ </div> </div> <div class="detaildata fl"> + <!--e2e detail data demonstration--> <div *ngIf="detailParams.serviceDomain == 'E2E Service'" class="baseparms clearfix"> <div class="vnf-box"> <h3> {{"i18nTextDefine_Base" | translate}} </h3> @@ -56,7 +57,7 @@ </ul> </div> </div> - + <!--e2e detail data demonstration--> <div *ngIf="detailParams.serviceDomain=='Network Service'" class="baseparms clearfix"> <div class="vnf-box"> <h3> {{"i18nTextDefine_Base" | translate}} </h3> @@ -93,7 +94,7 @@ </div> </div> - <!-- chart --> + <!--topo chart --> <div class="chart fr"> <div id="createChart"> <svg width="100%" height="100%"> diff --git a/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.ts b/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.ts index 554f25c6..5affeb97 100644 --- a/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.ts +++ b/usecaseui-portal/src/app/components/e2e-detail/e2e-detail.component.ts @@ -29,7 +29,6 @@ export class E2eDetailComponent implements OnInit { } ngOnInit() { - // this.getDetails(); this.dataInit(); } @@ -39,7 +38,6 @@ export class E2eDetailComponent implements OnInit { serviceInstanceName: any; serviceType: any; input_parameters: any; - nsinput_parameters: any; // e2e service = { @@ -52,7 +50,7 @@ export class E2eDetailComponent implements OnInit { ns_service = { name:"", description:"" - } + }; ns_nestedTemplates = []; ns_requestInputs = {}; roote2e = { @@ -120,7 +118,6 @@ export class E2eDetailComponent implements OnInit { }); console.log(this.e2e_nestedTemplates); console.log(this.e2e_requestInputs); - console.log(this.roote2e) } }else if(this.detailParams.serviceDomain == 'Network Service'){ this.ns_service = { @@ -139,7 +136,6 @@ export class E2eDetailComponent implements OnInit { }); console.log(this.ns_nestedTemplates); console.log(this.ns_requestInputs); - console.log(this.rootns) } this.drawImage(this.detailParams.serviceDomain) } @@ -158,19 +154,20 @@ export class E2eDetailComponent implements OnInit { } + // draw d3 charts render(data, imgmap) { - var width = document.getElementById("createChart").clientWidth, + let width = document.getElementById("createChart").clientWidth, height = document.getElementById("createChart").clientHeight; - var cluster = d3.layout.tree() + let cluster = d3.layout.tree() .size([width, height]); - var diagonal = d3.svg.diagonal() + let diagonal = d3.svg.diagonal() .projection(function (d) { return [d.x-18, d.y+40]; }); - var svg = d3.select("svg"); + let svg = d3.select("svg"); //marker - var marker = + let marker = svg.append("marker") .attr("id", "resolved") .attr("markerUnits", "strokeWidth") @@ -189,16 +186,16 @@ export class E2eDetailComponent implements OnInit { .attr("stroke-width", 1) .style("stroke", "#2F8BF7") .attr('fill', 'white'); - var i = 0; - var nodes = cluster.nodes(data).reverse(); + let i = 0; + let nodes = cluster.nodes(data).reverse(); nodes.forEach(function (d) { d.y = d.depth * 200+100; }); - var links = cluster.links(nodes); + let links = cluster.links(nodes); - var linkEnter = svg.selectAll("path.link") + let linkEnter = svg.selectAll("path.link") .data(links); linkEnter.enter().append("path") @@ -213,7 +210,7 @@ export class E2eDetailComponent implements OnInit { return "mypath" + i; }); - var node = svg.selectAll(".node") + let node = svg.selectAll(".node") .data(nodes) .enter() .append("g") |