Mercurial > gemma
comparison client/src/components/gauge/Waterlevel.vue @ 3303:d6405c6769a3
client: waterlevel diagram: wait for child component before rendering diagram
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Fri, 17 May 2019 09:50:24 +0200 |
parents | a409608dd6b3 |
children | ad27721d804d |
comparison
equal
deleted
inserted
replaced
3302:ec6163c6687d | 3303:d6405c6769a3 |
---|---|
1189 }, | 1189 }, |
1190 created() { | 1190 created() { |
1191 window.addEventListener("resize", debounce(this.drawDiagram), 100); | 1191 window.addEventListener("resize", debounce(this.drawDiagram), 100); |
1192 }, | 1192 }, |
1193 mounted() { | 1193 mounted() { |
1194 this.drawDiagram(); | 1194 // Nasty but necessary if we don't want to use the updated hook to re-draw |
1195 // the diagram because this would re-draw it also for irrelevant reasons. | |
1196 // In this case we need to wait for the child component (DiagramLegend) to | |
1197 // render. According to the docs (https://vuejs.org/v2/api/#mounted) this | |
1198 // should be possible with $nextTick() but it doesn't work because it does | |
1199 // not guarantee that the DOM is not only updated but also re-painted on the | |
1200 // screen. | |
1201 setTimeout(this.drawDiagram, 50); | |
1202 | |
1195 this.templates[0] = this.defaultTemplate; | 1203 this.templates[0] = this.defaultTemplate; |
1196 this.form.template = this.templates[0]; | 1204 this.form.template = this.templates[0]; |
1197 this.templateData = this.form.template; | 1205 this.templateData = this.form.template; |
1198 HTTP.get("/templates/diagram", { | 1206 HTTP.get("/templates/diagram", { |
1199 headers: { | 1207 headers: { |