Skip to content

Commit

Permalink
Stadia Maps (#1186)
Browse files Browse the repository at this point in the history 
* Handle new Stadia vendor type and create XYZ sources

* Attempt update of ol, ol-ext, and ol-layerswitcher

* fix imports on edit bar

* Rename ol5support folder, modify EditBar

* Testing better means of overriding code

* Revert "Testing better means of overriding code"

This reverts commit 39b1a09.

* Revert "Rename ol5support folder, modify EditBar"

This reverts commit 4346c59.

* Revert "fix imports on edit bar"

This reverts commit c584d4c.

* Revert "Attempt update of ol, ol-ext, and ol-layerswitcher"

This reverts commit 6f473bf.

* Add StadiaMaps support for OL2 canvas

* Rename function
  • Loading branch information
@alexgao1
alexgao1 authored Sep 13, 2023
1 parent e980853 commit a431149
Show file tree
Hide file tree
Showing 3 changed files with 183 additions and 4 deletions.
72 changes: 69 additions & 3 deletions nunaliit2-js/src/main/js/nunaliit2/n2.mapAndControls.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,41 @@ POSSIBILITY OF SUCH DAMAGE.
;(function($,$n2){
"use strict";

// Localization
var _loc = function(str,args){ return $n2.loc(str,'nunaliit2',args); };
var DH = 'n2.mapAndControls';
// Localization
var _loc = function(str,args){ return $n2.loc(str,'nunaliit2',args); };
var DH = 'n2.mapAndControls';

const stadiaMapsOptionsGenerator = (layerName) => {
const res = {
url: "",
options: { projection: new OpenLayers.Projection('EPSG:900913') }
}
if (layerName === "stamen_watercolor") {
res.url = "https://tiles.stadiamaps.com/tiles/stamen_watercolor/${z}/${x}/${y}.jpg"
res.options.numZoomLevels = 16
}
else {
res.url = "https://tiles.stadiamaps.com/tiles/" + layerName + "/${z}/${x}/${y}@2x.png"
res.options.numZoomLevels = 20
}

if (layerName.includes("stamen")) {
res.options.attribution = [
'&copy; <a href="https://www.stadiamaps.com/" target="_blank">Stadia Maps</a>',
'&copy; <a href="https://stamen.com/" target="_blank">Stamen Design</a>',
'&copy; <a href="https://openmaptiles.org/" target="_blank">OpenMapTiles</a>',
'&copy; <a href="https://www.openstreetmap.org/about/" target="_blank">OpenStreetMap contributors</a>'
].join(" ")
}
else {
res.options.attribution = [
'&copy; <a href="https://www.stadiamaps.com/" target="_blank">Stadia Maps</a>',
'&copy; <a href="https://openmaptiles.org/" target="_blank">OpenMapTiles</a>',
'&copy; <a href="https://www.openstreetmap.org/about/" target="_blank">OpenStreetMap contributors</a>'
].join(" ")
}
return res
}

// **************************************************
// Generic bridge between document model and map
Expand Down Expand Up @@ -2774,6 +2806,40 @@ var MapAndControls = $n2.Class('MapAndControls',{
};


} else if( 'stadia' === layerDefinition.type ){
var layerName = null
var layerOptions = {
isBaseLayer: isBaseLayer
}
if (typeof (layerDefinition.visibility) === 'boolean') {
layerOptions.visibility = layerDefinition.visibility;
}
var options = layerDefinition.options;
if (options) {
for (var optionKey in options) {
var optionValue = options[optionKey];
if (optionKey === 'layerName') {
layerName = optionValue;
}
else {
layerOptions[optionKey] = optionValue;
}
}
}
if (!layerName) {
$n2.reportError('Option layerName must be specified for a Stadia background.');
}
else {
const {
url,
options
} = stadiaMapsOptionsGenerator(layerName)
var l = new OpenLayers.Layer.XYZ(name, url, options);
if (name) {
l.name = name;
}
return l;
}
} else {
$n2.reportError('Unknown layer type: '+layerDefinition.type);
};
Expand Down
11 changes: 10 additions & 1 deletion nunaliit2-js/src/main/nunaliit-es6/src/n2es6/n2mapModule/N2MapCanvas.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ import mouseWheelZoom from 'ol/interaction/MouseWheelZoom.js';
import { defaults as defaultsInteractionSet } from 'ol/interaction.js';

import { default as DrawInteraction } from 'ol/interaction/Draw.js';
import N2StadiaMapsFactory from './N2StadiaMapsFactory';
import Stamen from 'ol/source/Stamen.js';
import OSM from 'ol/source/OSM';
import BingMaps from 'ol/source/BingMaps';
Expand Down Expand Up @@ -62,7 +63,8 @@ const VENDOR = {
WMS: 'wms',
WMTS: 'wmts',
OSM: 'osm',
STAMEN: 'stamen'
STAMEN: 'stamen',
STADIA: 'stadia'
};

const olStyleNames = {
Expand Down Expand Up @@ -1292,6 +1294,13 @@ class N2MapCanvas {
} else {
$n2.reportError('Parameter is missing for source: ' + sourceTypeInternal);
}
} else if (sourceTypeInternal === VENDOR.STADIA) {
if (sourceOptionsInternal
&& sourceOptionsInternal.layerName) {
return N2StadiaMapsFactory(sourceOptionsInternal.layerName)
} else {
$n2.reportError('Parameter is missing for source: ' + sourceTypeInternal)
}
} else {
$n2.reportError('Unrecognized type (' + layerDefinition.type + ')');
}
Expand Down
104 changes: 104 additions & 0 deletions nunaliit2-js/src/main/nunaliit-es6/src/n2es6/n2mapModule/N2StadiaMapsFactory.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,104 @@
/**
* @module n2es6/N2StadiaMapsFactory
*/

import XYZ from 'ol/source/XYZ';

const STADIA_MAPS_URL_TEMPLATE = (layer, pixelRatio, extension) => {
return `https://tiles.stadiamaps.com/tiles/${layer}/{z}/{x}/{y}${pixelRatio > 1 ? "@"+pixelRatio+"x" : ""}.${extension}`
}

const N2StadiaMapsFactory = (layerName) => {
if (layerName === "alidade_smooth") {
return new XYZ({
url: STADIA_MAPS_URL_TEMPLATE(layerName, 2, "png"),
attributions: [
'&copy; <a href="https://www.stadiamaps.com/" target="_blank">Stadia Maps</a>',
'&copy; <a href="https://openmaptiles.org/" target="_blank">OpenMapTiles</a>',
'&copy; <a href="https://www.openstreetmap.org/about/" target="_blank">OpenStreetMap contributors</a>'
],
tilePixelRatio: 2,
maxZoom: 20
})
}
else if (layerName === "alidade_smooth_dark") {
return new XYZ({
url: STADIA_MAPS_URL_TEMPLATE(layerName, 2, "png"),
attributions: [
'&copy; <a href="https://www.stadiamaps.com/" target="_blank">Stadia Maps</a>',
'&copy; <a href="https://openmaptiles.org/" target="_blank">OpenMapTiles</a>',
'&copy; <a href="https://www.openstreetmap.org/about/" target="_blank">OpenStreetMap contributors</a>'
],
tilePixelRatio: 2,
maxZoom: 20
})
}
else if (layerName === "outdoors") {
return new XYZ({
url: STADIA_MAPS_URL_TEMPLATE(layerName, 2, "png"),
attributions: [
'&copy; <a href="https://www.stadiamaps.com/" target="_blank">Stadia Maps</a>',
'&copy; <a href="https://openmaptiles.org/" target="_blank">OpenMapTiles</a>',
'&copy; <a href="https://www.openstreetmap.org/about/" target="_blank">OpenStreetMap contributors</a>'
],
tilePixelRatio: 2,
maxZoom: 20
})
}
else if (layerName === "stamen_toner") {
return new XYZ({
url: STADIA_MAPS_URL_TEMPLATE(layerName, 2, "png"),
attributions: [
'&copy; <a href="https://www.stadiamaps.com/" target="_blank">Stadia Maps</a>',
'&copy; <a href="https://stamen.com/" target="_blank">Stamen Design</a>',
'&copy; <a href="https://openmaptiles.org/" target="_blank">OpenMapTiles</a>',
'&copy; <a href="https://www.openstreetmap.org/about/" target="_blank">OpenStreetMap contributors</a>'
],
tilePixelRatio: 2,
maxZoom: 20
})
}
else if (layerName === "stamen_terrain") {
return new XYZ({
url: STADIA_MAPS_URL_TEMPLATE(layerName, 2, "png"),
attributions: [
'&copy; <a href="https://www.stadiamaps.com/" target="_blank">Stadia Maps</a>',
'&copy; <a href="https://stamen.com/" target="_blank">Stamen Design</a>',
'&copy; <a href="https://openmaptiles.org/" target="_blank">OpenMapTiles</a>',
'&copy; <a href="https://www.openstreetmap.org/about/" target="_blank">OpenStreetMap contributors</a>'
],
tilePixelRatio: 2,
maxZoom: 20
})
}
else if (layerName === "stamen_watercolor") {
return new XYZ({
url: STADIA_MAPS_URL_TEMPLATE(layerName, 1, "jpg"),
attributions: [
'&copy; <a href="https://www.stadiamaps.com/" target="_blank">Stadia Maps</a>',
'&copy; <a href="https://stamen.com/" target="_blank">Stamen Design</a>',
'&copy; <a href="https://openmaptiles.org/" target="_blank">OpenMapTiles</a>',
'&copy; <a href="https://www.openstreetmap.org/about/" target="_blank">OpenStreetMap contributors</a>'
],
tilePixelRatio: 1,
maxZoom: 16
})
}
else if (layerName === "osm_bright") {
return new XYZ({
url: STADIA_MAPS_URL_TEMPLATE(layerName, 2, "png"),
attributions: [
'&copy; <a href="https://www.stadiamaps.com/" target="_blank">Stadia Maps</a>',
'&copy; <a href="https://openmaptiles.org/" target="_blank">OpenMapTiles</a>',
'&copy; <a href="https://www.openstreetmap.org/about/" target="_blank">OpenStreetMap contributors</a>'
],
tilePixelRatio: 2,
maxZoom: 20
})
}
else {
$n2.reportErrorForced(`${layerName} is not an accepted/implemented layer name for Stadia backgrounds.`)
}
}

export default N2StadiaMapsFactory;

0 comments on commit a431149

Please sign in to comment.