# HG changeset patch
# User Thomas Junk <thomas.junk@intevation.de>
# Date 1562323159 -7200
# Node ID 242057dbc8c39de9fbf4aed629199d50acf3fc20
# Parent  9ad5a525f46a09a5e16fe53cf4eff97f67dfbdac
fix bottleneckselection: use id as identifier

diff -r 9ad5a525f46a -r 242057dbc8c3 client/src/components/fairway/AvailableFairwayDepthDialogue.vue
--- a/client/src/components/fairway/AvailableFairwayDepthDialogue.vue	Fri Jul 05 11:58:29 2019 +0200
+++ b/client/src/components/fairway/AvailableFairwayDepthDialogue.vue	Fri Jul 05 12:39:19 2019 +0200
@@ -70,7 +70,7 @@
           >
             <option
               v-for="bn in bottlenecksForCountry"
-              :key="bn.properties.name"
+              :key="bn.properties.id"
               :value="bn"
             >
               {{ bn.properties.name }}
diff -r 9ad5a525f46a -r 242057dbc8c3 client/src/components/fairway/Fairwayprofile.vue
--- a/client/src/components/fairway/Fairwayprofile.vue	Fri Jul 05 11:58:29 2019 +0200
+++ b/client/src/components/fairway/Fairwayprofile.vue	Fri Jul 05 12:39:19 2019 +0200
@@ -93,6 +93,7 @@
         </div>
       </DiagramLegend>
       <div
+        ref="pdfContainer"
         id="pdfContainer"
         class="d-flex flex-fill justify-content-center align-items-center diagram-container position-relative"
       >
@@ -148,7 +149,7 @@
 import * as d3 from "d3";
 import { mapState, mapGetters } from "vuex";
 import debounce from "debounce";
-import canvg from "canvg";
+import svg2pdf from "svg2pdf.js";
 import { pdfgen, templateLoader } from "@/lib/mixins";
 import { HTTP } from "@/lib/http";
 import { displayError } from "@/lib/errors";
@@ -367,8 +368,7 @@
     addDiagram(position, offset, width, height) {
       let x = offset.x,
         y = offset.y;
-      let svg = document.querySelector("#pdfContainer>svg").outerHTML;
-
+      let svg = document.querySelector("#pdfContainer>svg");
       // use default width,height if they are missing in the template definition
       if (!width) {
         width = this.templateData.properties.paperSize === "a3" ? 380 : 290;
@@ -382,16 +382,12 @@
       if (["bottomright", "bottomleft"].indexOf(position) !== -1) {
         y = this.pdf.height - offset.y - height;
       }
-      var canvas = document.createElement("canvas");
-      canvas.width = window.innerWidth;
-      canvas.height = window.innerHeight / 2;
-      canvg(canvas, svg, {
-        ignoreMouse: true,
-        ignoreAnimation: true,
-        ignoreDimensions: true
+      svg2pdf(svg, this.pdf.doc, {
+        xOffset: x,
+        yOffset: y,
+        // TODO depend on the size and aspect ration on paper
+        scale: this.templateData.properties.paperSize === "a3" ? 0.45 : 0.25
       });
-      var imgData = canvas.toDataURL("image/png");
-      this.pdf.doc.addImage(imgData, "PNG", x, y, width, height);
     },
     // Diagram legend
     addDiagramLegend(position, offset, color) {
diff -r 9ad5a525f46a -r 242057dbc8c3 client/src/components/fairway/Profiles.vue
--- a/client/src/components/fairway/Profiles.vue	Fri Jul 05 11:58:29 2019 +0200
+++ b/client/src/components/fairway/Profiles.vue	Fri Jul 05 12:39:19 2019 +0200
@@ -28,7 +28,7 @@
           >
             <option
               v-for="bn in bottlenecksForCountry"
-              :key="bn.properties.name"
+              :key="bn.properties.id"
               :value="bn.properties.name"
             >
               {{ bn.properties.name }}