Mercurial > gemma
diff client/src/components/gauge/HydrologicalConditions.vue @ 3147:25c0cbfcc515
client: gauge diagrams: fixed bug related to same clippath id in multiple diagrams
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Fri, 03 May 2019 11:32:25 +0200 |
parents | b6cc4838d2c0 |
children | cdfb0093b7b1 |
line wrap: on
line diff
--- a/client/src/components/gauge/HydrologicalConditions.vue Fri May 03 10:33:51 2019 +0200 +++ b/client/src/components/gauge/HydrologicalConditions.vue Fri May 03 11:32:25 2019 +0200 @@ -237,7 +237,7 @@ this.svg .append("defs") .append("clipPath") - .attr("id", "clip") + .attr("id", "hydrocond-clip") .append("rect") .attr("width", this.dimensions.width) .attr("height", this.dimensions.mainHeight); @@ -282,7 +282,7 @@ this.svg.selectAll(".hide").attr("fill-opacity", 0); this.svg .selectAll(".line") - .attr("clip-path", "url(#clip)") + .attr("clip-path", "url(#hydrocond-clip)") .attr("stroke-width", 2) .attr("fill", "none"); this.svg.selectAll(".line.mean").attr("stroke", "red"); @@ -291,14 +291,14 @@ this.svg.selectAll(".line.q75").attr("stroke", "purple"); this.svg .selectAll(".area") - .attr("clip-path", "url(#clip)") + .attr("clip-path", "url(#hydrocond-clip)") .attr("stroke", "none") .attr("fill", "lightsteelblue"); this.svg .selectAll(".hdc-line, .ldc-line, .mw-line") .attr("stroke-width", 1) .attr("fill", "none") - .attr("clip-path", "url(#clip)"); + .attr("clip-path", "url(#hydrocond-clip)"); this.svg.selectAll(".hdc-line").attr("stroke", "red"); this.svg.selectAll(".ldc-line").attr("stroke", "green"); this.svg.selectAll(".mw-line").attr("stroke", "grey"); @@ -311,7 +311,7 @@ .attr("stroke", "#999") .attr("stroke-width", 1) .attr("stroke-dasharray", "5, 5") - .attr("clip-path", "url(#clip)"); + .attr("clip-path", "url(#hydrocond-clip)"); this.svg .selectAll(".now-line-label") .attr("fill", "#999") @@ -336,7 +336,9 @@ .selectAll(".brush .handle") .attr("stroke", "rgba(23, 162, 184, 0.5)") .attr("fill", "rgba(23, 162, 184, 0.5)"); - this.svg.selectAll(".chart-dots").attr("clip-path", "url(#clip)"); + this.svg + .selectAll(".chart-dots") + .attr("clip-path", "url(#hydrocond-clip)"); this.svg .selectAll(".chart-dots .chart-dot") .attr("fill", "black")