From 4c0e0965a40e76658ee287197a1158b2eb857c5c Mon Sep 17 00:00:00 2001
From: "mathias.chouet" <mathias.chouet@irstea.fr>
Date: Thu, 16 Jul 2020 14:16:43 +0200
Subject: [PATCH] Modules Diagram: fix blank diagram issue with PreBarrage
---
.../modules-diagram.component.ts | 66 ++++++++++---------
1 file changed, 36 insertions(+), 30 deletions(-)
diff --git a/src/app/components/modules-diagram/modules-diagram.component.ts b/src/app/components/modules-diagram/modules-diagram.component.ts
index 80d08b7b7..79118556f 100644
--- a/src/app/components/modules-diagram/modules-diagram.component.ts
+++ b/src/app/components/modules-diagram/modules-diagram.component.ts
@@ -111,41 +111,47 @@ export class ModulesDiagramComponent implements AfterContentInit, AfterViewCheck
}
public ngAfterViewInit(): void {
- // add click listener on every calculator node in the graph, that
- // corresponds to an open module
- this.nativeElement.querySelectorAll("g.node").forEach(item => {
- if (item.id && this.formIsOpen(item.id)) {
- item.style.cursor = "pointer";
- item.addEventListener("click", () => {
- this.openCalc(item.id);
- });
- }
- });
+ setTimeout(() => { // clodo trick
+ // add click listener on every calculator node in the graph, that
+ // corresponds to an open module
+ this.nativeElement.querySelectorAll("g.node").forEach(item => {
+ if (item.id && this.formIsOpen(item.id)) {
+ item.style.cursor = "pointer";
+ item.addEventListener("click", () => {
+ this.openCalc(item.id);
+ });
+ }
+ });
+ }, 20); // @WARNING keep timeout > the one in ngAfterContentInit() below
}
public ngAfterContentInit(): void {
this.error = false;
- mermaid.initialize({
- // theme: "forest"
- flowchart: {
- curve: "basis"
- }
- });
- this.nativeElement = this.diagram.nativeElement;
-
- if (this.hasModules) {
- // generate graph description
- const graphDefinition = this.graphDefinition();
- // draw
- try {
- mermaid.render("graphDiv", graphDefinition, (svgCode, bindFunctions) => {
- this.nativeElement.innerHTML = svgCode;
- });
- } catch (e) {
- console.error(e);
- this.error = true;
+ // clodo trick or displaying modules diagram coming from a
+ // PreBarrage module results in a blank diagram
+ setTimeout(() => {
+ mermaid.initialize({
+ // theme: "forest"
+ flowchart: {
+ curve: "basis"
+ }
+ });
+ this.nativeElement = this.diagram.nativeElement;
+
+ if (this.hasModules) {
+ // generate graph description
+ const graphDefinition = this.graphDefinition();
+ // draw
+ try {
+ mermaid.render("graphDiv", graphDefinition, (svgCode, bindFunctions) => {
+ this.nativeElement.innerHTML = svgCode;
+ });
+ } catch (e) {
+ console.error(e);
+ this.error = true;
+ }
}
- }
+ }, 10);
}
public resetZoom() {
--
GitLab