blob: da765ecc3d56348340aa8ab50a4f293e1483da36 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
<style>
body {
margin: 0;
padding: 0;
}
svg {
display: block;
max-width: 100%;
max-height: 100%;
}
text {
font-family: "BNB-TTBidisha", sans-serif;
font-weight: bold;
font-size: 2;
fill: blue;
text-anchor: middle;
}
path {
fill-rule: evenodd;
fill: #ffcc66;
fill-opacity: 0.8;
stroke: #cc6633;
stroke-opacity: 0.8;
stroke-width: 0.2;
stroke-linecap: round;
stroke-linejoin: round;
}
.details {
font-size: 1.3rem;
display: flex;
width: 100%;
padding: 0 1rem 1rem 1rem;
border-bottom: 2px solid black;
justify-content: space-around;
margin-bottom: 0.2rem;
}
</style>
<div class="details">
<div>
DISTRICT: $district$
</div>
<div>
BLOCK: $block$
</div>
<div>
MOUZA: $mouza$
</div>
</div>
<svg>
$mapContent$
</svg>
<script>
let minx = Infinity;
let miny = Infinity;
let maxx = 0;
let maxy = 0;
const paths = document.querySelectorAll("path");
for (const p of paths) {
const b = p.getBBox();
minx = b.x < minx ? b.x : minx;
miny = b.y < miny ? b.y : miny;
maxx = maxx < b.x + b.width ? b.x + b.width : maxx;
maxy = maxy < b.y + b.height ? b.y + b.height : maxy;
}
for (const p of paths) {
const m = "M " + p.getAttribute("d").substr(2).split(",").map(cood => {
cood = cood.trim().split(" ");
return cood[0] + " " + (miny + maxy - parseFloat(cood[1])).toString();
}).join(", ");
p.setAttribute("d", m);
}
for (const t of document.querySelectorAll("text")) {
t.setAttribute("y", (miny + maxy - parseFloat(t.getAttribute("y"))).toString());
}
document.querySelector("svg")
.setAttribute(
"viewBox",
[minx, miny, maxx - minx, maxy - miny]
.map(e => e.toString()).join(" ")
);
window.addEventListener("afterprint", window.close);
window.print();
</script>
|
