forked from MapComplete/MapComplete
		
	Fix pdf export, fix feature switches
This commit is contained in:
		
							parent
							
								
									6cd75a8260
								
							
						
					
					
						commit
						ede67ca58c
					
				
					 19 changed files with 390 additions and 144 deletions
				
			
		|  | @ -1,38 +0,0 @@ | |||
| /** | ||||
|  * Creates screenshoter to take png screenshot | ||||
|  * Creates jspdf and downloads it | ||||
|  * 		-	landscape pdf | ||||
|  *  | ||||
|  * To add new layout: | ||||
|  * 		-	add new possible layout name in constructor  | ||||
|  * 		-	add new layout in "PDFLayout" | ||||
|  * 				-> in there are more instructions | ||||
|  */ | ||||
| 
 | ||||
|  import jsPDF from "jspdf"; | ||||
|  import { SimpleMapScreenshoter } from "leaflet-simple-map-screenshoter"; | ||||
|  import State from "../../State"; | ||||
|  import { PDFLayout } from "./PDFLayout"; | ||||
|   | ||||
|  export default class ExportPDF { | ||||
|      constructor( | ||||
|          name: string, | ||||
|          layout: "natuurpunt" | ||||
|      ){ | ||||
|          const screenshotter = new SimpleMapScreenshoter(); | ||||
|          //minimap op index.html -> hidden daar alles op doen en dan weg
 | ||||
|          //minimap - leaflet map ophalen - boundaries ophalen - State.state.featurePipeline
 | ||||
|          screenshotter.addTo(State.state.leafletMap.data); | ||||
|          let doc = new jsPDF('landscape'); | ||||
|          console.log("Taking screenshot") | ||||
|          screenshotter.takeScreen('image').then(image => { | ||||
|              if(!(image instanceof Blob)){ | ||||
|                  alert("Exporting failed :(") | ||||
|                  return; | ||||
|              } | ||||
|              let file = new PDFLayout(); | ||||
|              file.AddLayout(layout, doc, image); | ||||
|              doc.save(name); | ||||
|          }) | ||||
|      } | ||||
|  } | ||||
|  | @ -1,26 +0,0 @@ | |||
| /** | ||||
|  * Adds a theme to the pdf | ||||
|  *  | ||||
|  * To add new layout:	(first check ExportPDF.ts) | ||||
|  * 		-	in AddLayout() -> add new name for your layout  | ||||
|  * 				AddLayout(layout: "natuurpunt" ...) => AddLayout(layout: "natuurpunt" | "newlayout" ...) | ||||
|  * 		-	add if statement that checks which layout you want | ||||
|  * 		-	add new function to change the pdf layout | ||||
|  */ | ||||
| 
 | ||||
|  import jsPDF from "jspdf"; | ||||
| 
 | ||||
|  export class PDFLayout { | ||||
|      public AddLayout(layout: "natuurpunt", doc: jsPDF, image: Blob){ | ||||
|          if(layout === "natuurpunt") this.AddNatuurpuntLayout(doc, image); | ||||
|      } | ||||
|      public AddNatuurpuntLayout(doc: jsPDF, image: Blob){ | ||||
|          // Add Natuurpunt layout
 | ||||
|          const screenRatio = screen.width/screen.height; | ||||
|          let img = document.createElement('img'); | ||||
|          img.src = './assets/themes/natuurpunt/natuurpunt.png'; | ||||
|          doc.addImage(img, 'PNG', 15, 5, 20, 20); | ||||
|          doc.addImage(image, 'PNG', 15, 30, 150*screenRatio, 150); | ||||
|          return doc; | ||||
|      } | ||||
|  } | ||||
|  | @ -322,7 +322,7 @@ export class GeoOperations { | |||
|                 if (value === undefined) { | ||||
|                     line += "," | ||||
|                 } else { | ||||
|                     line += JSON.stringify(value)+"," | ||||
|                     line += JSON.stringify(value) + "," | ||||
|                 } | ||||
|             } | ||||
|             lines.push(line) | ||||
|  | @ -334,7 +334,7 @@ export class GeoOperations { | |||
| } | ||||
| 
 | ||||
| 
 | ||||
| class BBox { | ||||
| export class BBox { | ||||
| 
 | ||||
|     readonly maxLat: number; | ||||
|     readonly maxLon: number; | ||||
|  | @ -357,33 +357,20 @@ class BBox { | |||
|         this.check(); | ||||
|     } | ||||
| 
 | ||||
|     static fromLeafletBounds(bounds) { | ||||
|         return new BBox([[bounds.getWest(), bounds.getNorth()], [bounds.getEast(), bounds.getSouth()]]) | ||||
|     } | ||||
| 
 | ||||
|     static get(feature) { | ||||
|         if (feature.bbox?.overlapsWith === undefined) { | ||||
| 
 | ||||
|             if (feature.geometry.type === "MultiPolygon") { | ||||
|                 let coordinates = []; | ||||
|                 for (const coorlist of feature.geometry.coordinates) { | ||||
|                     coordinates = coordinates.concat(coorlist[0]); | ||||
|                 } | ||||
|                 feature.bbox = new BBox(coordinates); | ||||
|             } else if (feature.geometry.type === "Polygon") { | ||||
|                 feature.bbox = new BBox(feature.geometry.coordinates[0]); | ||||
|             } else if (feature.geometry.type === "LineString") { | ||||
|                 feature.bbox = new BBox(feature.geometry.coordinates); | ||||
|             } else if (feature.geometry.type === "Point") { | ||||
|                 // Point
 | ||||
|                 feature.bbox = new BBox([feature.geometry.coordinates]); | ||||
|             } else { | ||||
|                 throw "Cannot calculate bbox, unknown type " + feature.geometry.type; | ||||
|             } | ||||
|             const turfBbox: number[] = turf.bbox(feature) | ||||
|             feature.bbox = new BBox([[turfBbox[0], turfBbox[1]],[turfBbox[2], turfBbox[3]]]); | ||||
|         } | ||||
| 
 | ||||
|         return feature.bbox; | ||||
|     } | ||||
| 
 | ||||
|     public overlapsWith(other: BBox) { | ||||
|         this.check(); | ||||
|         other.check(); | ||||
|         if (this.maxLon < other.minLon) { | ||||
|             return false; | ||||
|         } | ||||
|  | @ -397,6 +384,22 @@ class BBox { | |||
| 
 | ||||
|     } | ||||
| 
 | ||||
|     public isContainedIn(other: BBox) { | ||||
|         if (this.maxLon > other.maxLon) { | ||||
|             return false; | ||||
|         } | ||||
|         if (this.maxLat > other.maxLat) { | ||||
|             return false; | ||||
|         } | ||||
|         if (this.minLon < other.minLon) { | ||||
|             return false; | ||||
|         } | ||||
|         if (this.minLat < other.minLat) { | ||||
|             return false | ||||
|         } | ||||
|         return true; | ||||
|     } | ||||
| 
 | ||||
|     private check() { | ||||
|         if (isNaN(this.maxLon) || isNaN(this.maxLat) || isNaN(this.minLon) || isNaN(this.minLat)) { | ||||
|             console.log(this); | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue