nakarte

commit c73c014c33f4a60bb60ada44287200e385688aab
parent 6aab86b171715187613137d82ad134b26cde58da
Author: Sergej Orlov <wladimirych@gmail.com>
Date:   Sat, 18 Mar 2017 01:31:28 +0300

[print] overlay scale and page number

Diffstat:
M
src/lib/leaflet.control.printPages/control.js
 | 
9
+++++++--
A
src/lib/leaflet.control.printPages/decoration.scale.js
 | 
29
+++++++++++++++++++++++++++++
M
src/lib/leaflet.control.printPages/map-render.js
 | 
9
++++++---

3 files changed, 42 insertions(+), 5 deletions(-)
diff --git a/src/lib/leaflet.control.printPages/control.js b/src/lib/leaflet.control.printPages/control.js
@@ -15,6 +15,7 @@ import 'lib/leaflet.hashState/leaflet.hashState';
 import 'lib/leaflet.control.commons';
 import logging from 'lib/logging';
 import  {MagneticMeridians} from './decoration.magnetic-meridians';
+import {OverlayScale} from './decoration.scale';
 
 ko.extenders.checkNumberRange = function(target, range) {
     return ko.pureComputed({
@@ -200,7 +201,8 @@ L.Control.PrintPages = L.Control.extend({
             const pages = this.pages.map((page) => {
                     return {
                         latLngBounds: page.getLatLngBounds(),
-                        printSize: page.getPrintSize()
+                        printSize: page.getPrintSize(),
+                        label: page.getLabel()
                     }
                 }
             );
@@ -209,6 +211,7 @@ L.Control.PrintPages = L.Control.extend({
             if (this.magneticMerisiansdOn()) {
                 decorationLayers.push(new MagneticMeridians());
             }
+            decorationLayers.push(new OverlayScale());
             renderPages({
                     map: this._map,
                     pages,
@@ -234,12 +237,14 @@ L.Control.PrintPages = L.Control.extend({
             logging.captureBreadcrumbWithUrl({message: 'start save page jpg', data: {pageNumber: page.getLabel()}});
             const pages = [{
                 latLngBounds: page.getLatLngBounds(),
-                printSize: page.getPrintSize()
+                printSize: page.getPrintSize(),
+                label: page.getLabel()
             }];
             const decorationLayers = [];
             if (this.magneticMerisiansdOn()) {
                 decorationLayers.push(new MagneticMeridians());
             }
+            decorationLayers.push(new OverlayScale());
             this.downloadProgressRange(1000);
             this.downloadProgressDone(undefined);
             this.makingPdf(true);
diff --git a/src/lib/leaflet.control.printPages/decoration.scale.js b/src/lib/leaflet.control.printPages/decoration.scale.js
@@ -0,0 +1,28 @@
+import {PrintStaticLayer} from './decorations';
+
+class OverlayScale extends PrintStaticLayer {
+    fontSizeMm = 3;
+    font = 'verdana';
+    paddingMm = 1;
+
+    _drawRaster(canvas, printOptions) {
+        const ctx = canvas.getContext('2d');
+        const scale = Math.round(printOptions.scale);
+        let caption = `${scale} m in 1 cm`;
+        if (printOptions.pagesCount > 1) {
+            caption += ` | Page ${printOptions.pageLabel} / ${printOptions.pagesCount}`;
+        }
+        const fontSize = this.fontSizeMm / 25.4 * printOptions.resolution;
+        const padding = this.paddingMm / 25.4 * printOptions.resolution;
+        ctx.font = `${fontSize}px ${this.font}`;
+        const textWidth = ctx.measureText(caption).width;
+        ctx.textBaseline = 'bottom';
+        ctx.fillStyle = '#ffffff';
+        ctx.fillRect(0, 0, textWidth + 2 * padding, fontSize + 2 * padding);
+        ctx.fillStyle = '#000000';
+        ctx.fillText(caption, padding, fontSize + padding);
+
+    }
+}
+
+export {OverlayScale};
+\ No newline at end of file
diff --git a/src/lib/leaflet.control.printPages/map-render.js b/src/lib/leaflet.control.printPages/map-render.js
@@ -171,7 +171,7 @@ class PageComposer {
     }
 }
 
-async function* iterateLayersTiles(layers, latLngBounds, destPixelSize, resolution, scale, zooms) {
+async function* iterateLayersTiles(layers, latLngBounds, destPixelSize, resolution, scale, zooms, pageLabel, pagesCount) {
     const defaultXHROptions = {
         responseType: 'blob',
         timeout: 20000,
@@ -201,7 +201,9 @@ async function* iterateLayersTiles(layers, latLngBounds, destPixelSize, resoluti
                 destPixelSize,
                 resolution,
                 scale,
-                zoom
+                zoom,
+                pageLabel,
+                pagesCount
             }
         );
         let layerPromises = [];
@@ -276,7 +278,8 @@ async function renderPages({map, pages, zooms, resolution, scale, progressCallba
         );
 
         const composer = new PageComposer(destPixelSize, pixelBounds);
-        let tilesIterator = await iterateLayersTiles(layers, page.latLngBounds, destPixelSize, resolution, scale, zooms);
+        let tilesIterator = await iterateLayersTiles(layers, page.latLngBounds, destPixelSize, resolution, scale, zooms,
+            page.label, pages.length);
         let queuedTilesIterator = promiseQueueBuffer(tilesIterator, 20);
         while (true) {
             let {value: tilePromise, done} = await queuedTilesIterator.next();