From 167545ffbfff191ae9cce23c2301b7d89af1466e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nicol=C3=B2=20P?= Date: Thu, 2 Mar 2023 16:07:15 +0100 Subject: [PATCH] Use Leaflet for map --- css/.ds.css.swp | Bin 12288 -> 0 bytes css/ds.css | 5 ++++- js/ds.js | 21 +++++++++++++++++++-- js/views/report.js | 14 +++++++++++--- package.json | 1 + report/index.html | 8 +++++--- yarn.lock | 5 +++++ 7 files changed, 45 insertions(+), 9 deletions(-) delete mode 100644 css/.ds.css.swp diff --git a/css/.ds.css.swp b/css/.ds.css.swp deleted file mode 100644 index 857f5af611f631574eb35745e2bf59bae932db3a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 12288 zcmeI2J#W)M7{{*&AqEPFiv8LG1r$3@LfR^k5E2N~0mK3W6@wk09k;g6vM;nDynhEq zMud=<5PQYa4K^ku#5dpzAeI05C2awfiVgHw`PsR*$ItV-ERpS4x0kN-MYG9p9B0gU z|GhV}@P=(R4zf7t$x!Nny^lmDhRpV!qemYV0qcICj3kvSqNlRDn;BjzV`V6jsd_Kd zJti)H4o5S{02$b?fr0Xj#Yxs`HY~klc4nGSow&8%)ijR`kO4A42FL&zAOmE843L5U zz<^37*kjajpsXeTbAay?WxKkTO}dZ)GC&5%02v?yWPl8i0Wv@a$N(821OK1_+r@MF zBaGddMDlq4U;Y38c#N?RU=zFpZ^3Ku6s&-o;0Cw?=D`_o3LFN9z}8X5zJf2{6W9RH z!87m#jDP?=und;KHE+zwYSybqya? z!*=Q;s*(v}rXu3gL6pc;*|9?ONEyxX)Wmk(Aoe@Fq37vSH_ytkd#ipb2eE7D_qEdw zpY=Si7>n}o9d2=Zpk&ckX0y;fjXR`5-wg|6We2fHf4-X$3QuAE&T!j(%H@L)OUh!# z8Md_>jD*2BUKnJ`$kZ?t9UjYA*JC3b8&Dz4hLZq%w)P}{A+aHLW) z!hYpR=^s#8XR+Pe-HuEVetUkh4s)o-PsNaDG7Q{qb(6|iRdB6+a$6 jXPWhUB6ek3_w>%LiA+WUFWL){zhZBPp?=4HuFHM^cfS`0 diff --git a/css/ds.css b/css/ds.css index 053c76b..644e086 100644 --- a/css/ds.css +++ b/css/ds.css @@ -59,6 +59,9 @@ table.table td, table.table th { border: none; } +#map { + height: 600px; +} /* Print styles */ @media print { @@ -70,4 +73,4 @@ table.table th { #map { display: none; } -} \ No newline at end of file +} diff --git a/js/ds.js b/js/ds.js index ddd69ef..70badae 100644 --- a/js/ds.js +++ b/js/ds.js @@ -12,10 +12,14 @@ export const OBJECT_ORDER = { "Object Chronology" : null, "Object Era" : null, "Object Geographical Context of Discovery" : null, - "Object Description" : null, - "Object Conservation State" : null, "Object Dimensions" : null, "Object Material" : null, + "Object Description" : null, + "Object Conservation State" : null, + "Object Reused?" : null, + "Object Project" : null, + "Object Compiler" : null, + "Object Bibliography" : null, }; /* export const SAMPLE_ORDER = { @@ -82,6 +86,19 @@ export function printReport() { window.print(); }); } +export function attachMap(coordinates, htmlId = 'map') { + const map = L.map(htmlId).setView(coordinates, 13); + + L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { + attribution: '© OpenStreetMap contributors' + }).addTo(map); + + L.marker(coordinates).addTo(map); + /* + .bindPopup('A pretty CSS3 popup.
Easily customizable.') + .openPopup(); + */ +} /** * @todo Use TS to define object shape * @param {object} resource The resource object (Arches JSON!) diff --git a/js/views/report.js b/js/views/report.js index 8ec4dc7..07eef81 100644 --- a/js/views/report.js +++ b/js/views/report.js @@ -5,7 +5,8 @@ import { fetchReport, printReport, getImageSrc, - OBJECT_ORDER + OBJECT_ORDER, + attachMap } from "../ds.js"; document.addEventListener('readystatechange', async () => { @@ -27,8 +28,15 @@ document.addEventListener('readystatechange', async () => { } resType = resKeys[0].split(' ')[0]; - // TODO use coordinates for map - const coordinates = resource['Coordinates']; + // TODO use match... + const coordinates = resource['Object Coordinates'] + .replace(/^.*coordinates\':\s?\[(\d+\.\d+,\s?\d+\.\d+)\].*$/, "$1") + .split(', '); + + let lat, long; + [long, lat] = coordinates; + + attachMap([lat, long]); resKeys = resKeys.filter(e => !e.includes('Coordinates')); diff --git a/package.json b/package.json index f49dfae..7ff26fc 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "license": "MIT", "dependencies": { "fontawesome-free": "^1.0.4", + "leaflet": "^1.9.3", "plotly.js": "^2.18.2", "spectre.css": "^0.5.9", "spotlight.js": "^0.7.8" diff --git a/report/index.html b/report/index.html index 92dbb4e..1914e2d 100644 --- a/report/index.html +++ b/report/index.html @@ -4,8 +4,10 @@ DataSpace | Report + + @@ -32,7 +34,7 @@
-
+

@@ -40,8 +42,8 @@
-
- +
+