47 lines
1.8 KiB
HTML
47 lines
1.8 KiB
HTML
---
|
|
layout: example.html
|
|
title: Print to scale example
|
|
shortdesc: Example of printing a map to a specified scale.
|
|
docs: >
|
|
Example of printing a map to a specified scale.
|
|
The print is exported as a PDF using the <a href="https://github.com/MrRio/jsPDF" target="_blank">jsPDF</a> library.
|
|
Unlike the <a href="export-pdf.html">Export PDF example</a> the on screen map is only used to set the center and rotation.
|
|
The extent printed depends on the scale and page size. To print the scale bar and attributions the example uses the
|
|
<a href="https://html2canvas.hertzen.com/" target="_blank">html2canvas</a> library.
|
|
tags: "print, printing, scale, scaleline, export, pdf, grid"
|
|
resources:
|
|
- https://html2canvas.hertzen.com/dist/html2canvas.min.js
|
|
- https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.3.1/jspdf.umd.min.js
|
|
---
|
|
<div class="wrapper">
|
|
<div id="map" class="map"></div>
|
|
</div>
|
|
<form class="form">
|
|
<label for="format">Page size </label>
|
|
<select id="format">
|
|
<option value="a0">A0 (slow)</option>
|
|
<option value="a1">A1</option>
|
|
<option value="a2">A2</option>
|
|
<option value="a3">A3</option>
|
|
<option value="a4" selected>A4</option>
|
|
<option value="a5">A5 (fast)</option>
|
|
</select>
|
|
<label for="resolution">Resolution </label>
|
|
<select id="resolution">
|
|
<option value="72">72 dpi (fast)</option>
|
|
<option value="150">150 dpi</option>
|
|
<option value="200" selected>200 dpi</option>
|
|
<option value="300">300 dpi (slow)</option>
|
|
</select>
|
|
<label for="scale">Scale </label>
|
|
<select id="scale">
|
|
<option value="500">1:500000</option>
|
|
<option value="250" selected>1:250000</option>
|
|
<option value="100">1:100000</option>
|
|
<option value="50">1:50000</option>
|
|
<option value="25">1:25000</option>
|
|
<option value="10">1:10000</option>
|
|
</select>
|
|
</form>
|
|
<button id="export-pdf">Export PDF</button>
|