Mercurial > gemma

changeset 4137:a41fd26c1644 improvepdf

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
fairwayprofile: set margins relative to svgheight and svgwidth
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 01 Aug 2019 11:47:27 +0200
parents 630b817d12b3
children 33deb8634783
files client/src/components/fairway/Fairwayprofile.vue
diffstat 1 files changed, 9 insertions(+), 9 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/fairway/Fairwayprofile.vue	Thu Aug 01 11:22:46 2019 +0200
+++ b/client/src/components/fairway/Fairwayprofile.vue	Thu Aug 01 11:47:27 2019 +0200
@@ -112,7 +112,7 @@
   height: 0
   border-top: dashed 2px #333
   position: absolute
-  bottom: 20px
+  bottom: 50px
   left: 115px
   margin-left: -35px
   &::after
@@ -381,13 +381,13 @@
       this.pdf.doc.circle(x, y + 25, 2, "FD");
       this.pdf.doc.text(x + 3, y + 26, "Sediment (Compare)");
     },
-    getPrintLayout() {
+    getPrintLayout(svgHeight, svgWidth) {
       return {
         main: {
-          top: 20,
-          right: 80,
-          bottom: 60,
-          left: 80
+          top: Math.floor(0.08 * svgHeight),
+          right: Math.floor(0.08 * svgWidth),
+          bottom: Math.floor(0.2 * svgHeight),
+          left: Math.floor(0.08 * svgWidth)
         }
       };
     },
@@ -395,7 +395,7 @@
       d3.select(".diagram-container svg").remove();
       this.scaleFairwayProfile();
       if (!this.height || !this.width) return; // do not try to render when height and width are unknown
-      const layout = this.getPrintLayout(this.height);
+      const layout = this.getPrintLayout(this.height, this.width);
       this.renderTo({
         element: ".diagram-container",
         dimensions: this.getDimensions({
@@ -500,7 +500,7 @@
       graph
         .append("text")
         .attr("transform", ["rotate(-90)"])
-        .attr("y", dimensions.width + 45)
+        .attr("y", dimensions.width + Math.floor(0.06 * dimensions.width))
         .attr("x", -dimensions.mainHeight / 2)
         .attr("fill", "black")
         .style("text-anchor", "middle")
@@ -508,7 +508,7 @@
       graph
         .append("text")
         .attr("transform", ["rotate(-90)"])
-        .attr("y", -50)
+        .attr("y", -1 * Math.floor(0.065 * dimensions.width))
         .attr("x", -dimensions.mainHeight / 2)
         .attr("fill", "black")
         .style("text-anchor", "middle")