Mercurial > gemma
changeset 1933:1aa2921d8832
client: pdf-gen: make scalebar box size dynamic
* Change the calculation of the size of the scalebar to use a fixed
maximum size and draw the box around it, when the size has been
cacalculated. Use a fixed placement in the lower right corner for now.
author | Bernhard Reiter <bernhard@intevation.de> |
---|---|
date | Mon, 21 Jan 2019 13:02:32 +0100 |
parents | e734d48ef964 |
children | ec7360afd5e1 17b6d2a6fb76 |
files | client/src/components/Pdftool.vue |
diffstat | 1 files changed, 10 insertions(+), 33 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/Pdftool.vue Mon Jan 21 12:21:01 2019 +0100 +++ b/client/src/components/Pdftool.vue Mon Jan 21 13:02:32 2019 +0100 @@ -158,10 +158,6 @@ var mapExtent = map.getView().calculateExtent(mapSize); var pdf = new jsPDF(this.form.format, "mm", this.form.paperSize); - var scalebarSize = - this.form.format === "portrait" && this.form.paperSize === "a4" - ? 10 - : 15; var northarrowSize = 3; var self = this; @@ -187,32 +183,7 @@ var data = canvas.toDataURL("image/jpeg"); pdf.addImage(data, "JPEG", 0, 0, width, height); - self.addRoundedBox( - pdf, - width - scalebarSize * 5.2, - height - scalebarSize, - scalebarSize * 5, - scalebarSize - ); - self.addScalebar( - pdf, - width - scalebarSize * 5, - height - scalebarSize / 2, - scalebarSize * 4, - scaleNominator - ); - /* - self.addText( - pdf, - width - scalebarSize * 5, - height - scalebarSize * 0.6, - 10, - "black", - 50, - "Scale 1:" + scaleNominator - ); - */ - //self.addText(pdf, 150, 20, 10, "black", 70, "some text"); + self.addScaleBar(pdf, width, height, scaleNominator); self.addNorthArrow(pdf, 15, 9, northarrowSize); self.addPageInfo(pdf); self.addAboutBox(pdf, width, height); @@ -259,10 +230,12 @@ doc.setFillColor(255, 255, 255); doc.roundedRect(x, y, w, h, 3, 3, "FD"); }, - addScalebar(doc, x, y, maxWidth, scaleNominator) { - // maxWidth in mm + addScaleBar(doc, docWidth, docHeight, scaleNominator) { // scaleNominator is the x in 1:x of the map scale + // hardcode maximal width for now and place in lower right corner + let maxWidth = 80; // in mm + // reduce width until we'll find a nice number for printing // strategy: // 1. check which unit prefix we shall use to get [10:10000[ @@ -315,7 +288,11 @@ } let size = (length * unitConversionFactor) / scaleNominator / 4; - // DEBUG console.log(length, size); + + let x = docWidth - (size * 4 + 8); + let y = docHeight - 6; + + this.addRoundedBox(doc, x - 4 , y - 4, size * 4 + 12, 10); doc.setDrawColor(0, 0, 0); doc.setFillColor(0, 0, 0);