Fix mapbox satellite layer bug

This commit is contained in:
Nicolò P 2023-03-17 13:32:40 +01:00
parent d39e6b740c
commit ec426a6900
2 changed files with 20 additions and 6 deletions

View File

@ -1,5 +1,5 @@
'use strict'; 'use strict';
const MAPBOX_API_KEY = 'pk.eyJ1IjoiZ2VyYW5nMSIsImEiOiJjbDg5MHZxcG8wMmo3M3BudnphMWhnN2ZrIn0.SsFGVF-EMHwRYTp7njmb_Q'; const MAPBOX_TOKEN = 'pk.eyJ1Ijoibmljb3BhIiwiYSI6ImNsZmNiZGN0ZTJzbGgzdG8xYnZxOXRvd28ifQ.nvK1VYF6lwPpA094cL83KQ';
/** /**
* @namespace DataSpace * @namespace DataSpace
*/ */
@ -25,7 +25,18 @@ DataSpace.OBJECT_ORDER = {
"Object Bibliography" : null, "Object Bibliography" : null,
}; };
/* /*
export const SAMPLE_ORDER = { DataSpace.CONTEXT_ORDER = {
"Cultural Context Name" : null,
"Cultural Context Typology" : null,
"Cultural Context Chronology" : null,
"Cultural Context Era" : null,
"Cultural Context Surface" : null,
"Cultural Context Square meters" : null,
"Cultural Context Quality of the marble used/extracted" : null,
"Cultural Context Description" : null,
"Cultural Context Traces of extraction tools" : null,
"Cultural Context Amount of debris (cm3)" : null,
"Cultural Context Presence of unfinished materials" : null,
}; };
*/ */
@ -107,7 +118,7 @@ DataSpace.createObjectShape = function (resource) {
return shape; return shape;
} }
/** /**
* @todo Refactor!! * @todo Refactor!! Make it general...
* *
* @param {object} report The report's JSON object * @param {object} report The report's JSON object
* @param {string[]} images Filenames of images * @param {string[]} images Filenames of images
@ -130,6 +141,7 @@ DataSpace.renderObjectReport = function (report, images)
} }
resType = resKeys[0].split(' ')[0]; resType = resKeys[0].split(' ')[0];
// TODO use match... // TODO use match...
// TODO check if coordinates exists... // TODO check if coordinates exists...
const coordinates = resource['Object Coordinates'] const coordinates = resource['Object Coordinates']
@ -202,7 +214,7 @@ DataSpace.printReport = function () {
*/ */
DataSpace.createMap = function (coordinates, htmlId = 'map') { DataSpace.createMap = function (coordinates, htmlId = 'map') {
const mapboxAttribution = `© <a href="https://www.mapbox.com/about/maps/">Mapbox</a>`; const mapboxAttribution = `© <a href="https://www.mapbox.com/about/maps/">Mapbox</a>`;
const mapboxSat = `https://api.mapbox.com/v4/mapbox.satellite/18/152278/101181.webp?access_token=${MAPBOX_API_KEY}`; const mapboxSat = `https://api.mapbox.com/v4/{id}/{z}/{x}/{y}@2x.jpg90?access_token=${MAPBOX_TOKEN}`;
const streets = L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { const streets = L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18, maxZoom: 18,
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>' attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
@ -210,10 +222,11 @@ DataSpace.createMap = function (coordinates, htmlId = 'map') {
const satellite = L.tileLayer( const satellite = L.tileLayer(
mapboxSat, mapboxSat,
{ {
id: 'mapbox/satellite-v9', id: 'mapbox.satellite',
tileSize: 512, tileSize: 512,
zoomOffset: -1, zoomOffset: -1,
attribution: mapboxAttribution attribution: mapboxAttribution,
maxZoom: 18
} }
); );
const baseMaps = { const baseMaps = {

View File

@ -2,6 +2,7 @@
<html> <html>
<head> <head>
<title>DataSpace | Report</title> <title>DataSpace | Report</title>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<link href="../vendor/spectre.css/dist/spectre.css" rel="stylesheet" /> <link href="../vendor/spectre.css/dist/spectre.css" rel="stylesheet" />
<link href="../css/ds.css" rel="stylesheet" /> <link href="../css/ds.css" rel="stylesheet" />
<link href="../vendor/leaflet/dist/leaflet.css" rel="stylesheet" /> <link href="../vendor/leaflet/dist/leaflet.css" rel="stylesheet" />