comparison client/src/components/gauge/Waterlevel.vue @ 3032:3aca036e11f1

client: improve pdf properties for diagrams * adjust the papersize,unit and format of the pdf * specify the size of the exported diagram on pdf
author Fadi Abbud <fadi.abbud@intevation.de>
date Fri, 12 Apr 2019 13:34:18 +0200
parents fe88a9b151ca
children 44dc837638d9
comparison
equal deleted inserted replaced
3031:f99f0cbb843f 3032:3aca036e11f1
183 var svg = this.$refs.diagramContainer.innerHTML; 183 var svg = this.$refs.diagramContainer.innerHTML;
184 console.log(this.svg); 184 console.log(this.svg);
185 if (svg) { 185 if (svg) {
186 svg = svg.replace(/\r?\n|\r/g, "").trim(); 186 svg = svg.replace(/\r?\n|\r/g, "").trim();
187 } 187 }
188 var pdf = new jsPDF("p", "pt", "c2"); 188 var pdf = new jsPDF("l", "mm", "a3");
189 var canvas = document.createElement("canvas"); 189 var canvas = document.createElement("canvas");
190 canvas.width = window.innerWidth; 190 canvas.width = window.innerWidth;
191 canvas.height = 500; 191 canvas.height = 500;
192 canvg(canvas, svg, { 192 canvg(canvas, svg, {
193 ignoreMouse: true, 193 ignoreMouse: true,
194 ignoreAnimation: true, 194 ignoreAnimation: true,
195 ignoreDimensions: true 195 ignoreDimensions: true
196 }); 196 });
197 var imgData = canvas.toDataURL("image/png"); 197 var imgData = canvas.toDataURL("image/png");
198 pdf.addImage(imgData, "PNG", 50, 200); 198 pdf.addImage(imgData, "PNG", 40, 60, 380, 130);
199 pdf.save("waterlevel-Diagram.pdf"); 199 pdf.save("waterlevel-Diagram.pdf");
200 }, 200 },
201 drawDiagram() { 201 drawDiagram() {
202 // remove old diagram and exit if necessary data is missing 202 // remove old diagram and exit if necessary data is missing
203 d3.select(".diagram-container svg").remove(); 203 d3.select(".diagram-container svg").remove();