--- a/client/src/components/Pdftool.vue	Wed Jan 16 15:46:57 2019 +0100
+++ b/client/src/components/Pdftool.vue	Wed Jan 16 20:58:59 2019 +0100
@@ -113,7 +113,7 @@
         this.form.format
       );
       var width, height;
-      // generate PDF and open it
+
       if (this.form.format !== "portrait") {
         // landscape, default
         width = paperSizes[this.form.paperSize][0];
@@ -129,25 +129,42 @@
       // FUTURE: consider margins
       console.log(width, height);
 
+      // generate PDF and open it
+      // our units are milimeters; width 0 x height 0 is left upper corner
+
+      // Step 1 prepare and save current map extend
+      // Then add callback "rendercomplete" for Step 3
+      //    which will generate the pdf and resets the map view
+      // Step 2 which starts rendering a map with the necessary image size
+
       var map = this.openLayersMap;
       var mapSize = map.getSize(); // size in pixels of the map in the DOM
       // Calculate the extent for the current view state and the passed size.
       // The size is the pixel dimensions of the box into which the calculated
       // extent should fit.
       var mapExtent = map.getView().calculateExtent(mapSize);
+
       var pdf = new jsPDF(this.form.format, "mm", this.form.paperSize);
-      var self = this;
       var scalebarSize =
-        self.form.format === "portrait" && self.form.paperSize === "a4"
+        this.form.format === "portrait" && this.form.paperSize === "a4"
           ? 10
           : 15;
       var northarrowSize = 3;
+      var self = this;
+
       // set a callback for after the next complete rendering of the map
       map.once("rendercomplete", function(event) {
         let canvas = event.context.canvas;
         console.log("rendered", canvas);
         var data = canvas.toDataURL("image/png");
         pdf.addImage(data, "PNG", 0, 0, width, height);
+        self.addRoundedBox(
+          pdf,
+          width - scalebarSize * 5.5,
+          height - scalebarSize,
+          scalebarSize * 5,
+          scalebarSize
+        );
         self.addScalebar(
           pdf,
           width - scalebarSize * 5,
@@ -191,11 +208,14 @@
       document.body.removeChild(a);
       */
     },
-
-    addScalebar(doc, x, y, size) {
+    addRoundedBox(doc, x, y, w, h) {
+      // draws a rounded background box at (x,y) width x height
+      // using jsPDF units
       doc.setDrawColor(255, 255, 255);
       doc.setFillColor(255, 255, 255);
-      doc.roundedRect(x - size / 2, y - size / 2, size * 5, size, 3, 3, "FD");
+      doc.roundedRect(x, y, w, h, 3, 3, "FD");
+    },
+    addScalebar(doc, x, y, size) {
       doc.setDrawColor(0, 0, 0);
       doc.setFillColor(0, 0, 0);
       doc.rect(x, y, size, 1, "FD");