Fix WMS layers of the layer editor index
This commit is contained in:
parent
3d4c6f2207
commit
6509358f84
9 changed files with 79 additions and 341795 deletions
|
@ -27,7 +27,9 @@ export default class AvailableBaseLayers {
|
|||
attribution_url: "https://openStreetMap.org/copyright",
|
||||
name: "OpenStreetMap",
|
||||
layer: Basemap.CreateBackgroundLayer("osm", "OpenStreetMap",
|
||||
"https://tile.openstreetmap.org/{z}/{x}/{y}.png", "OpenStreetMap", 19, false, false),
|
||||
"https://tile.openstreetmap.org/{z}/{x}/{y}.png", "OpenStreetMap", "https://openStreetMap.org/copyright",
|
||||
19,
|
||||
false, false),
|
||||
feature: null,
|
||||
max_zoom: 19,
|
||||
min_zoom: 0
|
||||
|
@ -138,14 +140,12 @@ export default class AvailableBaseLayers {
|
|||
continue;
|
||||
}
|
||||
|
||||
if (props.id === "carto") {
|
||||
if (props.id === "MAPNIK") {
|
||||
// Already added by default
|
||||
continue;
|
||||
}
|
||||
|
||||
if (props.overlay) {
|
||||
console.log("Refusing overlay layer ", props.name)
|
||||
|
||||
continue;
|
||||
}
|
||||
|
||||
|
@ -153,8 +153,9 @@ export default class AvailableBaseLayers {
|
|||
continue;
|
||||
}
|
||||
|
||||
if (props.url.toLowerCase().indexOf("{bbox}") > 0) {
|
||||
console.warn("Editor layer index: needs bbox ", props)
|
||||
if(props.max_zoom < 19){
|
||||
// We want users to zoom to level 19 when adding a point
|
||||
// If they are on a layer which hasn't enough precision, they can not zoom far enough. This is confusing, so we don't use this layer
|
||||
continue;
|
||||
}
|
||||
|
||||
|
@ -168,6 +169,7 @@ export default class AvailableBaseLayers {
|
|||
props.name,
|
||||
props.url,
|
||||
props.name,
|
||||
props.license_url,
|
||||
props.max_zoom,
|
||||
props.type.toLowerCase() === "wms",
|
||||
props.type.toLowerCase() === "wmts"
|
||||
|
|
|
@ -3,58 +3,13 @@ import {UIEventSource} from "../UIEventSource";
|
|||
import {UIElement} from "../../UI/UIElement";
|
||||
|
||||
|
||||
export class BaseLayers {
|
||||
|
||||
|
||||
/*public static readonly baseLayers: { name: string, layer: any, id: string } [] = [
|
||||
|
||||
{
|
||||
id: "aiv-latest",
|
||||
name: "Luchtfoto Vlaanderen (recentste door AIV)",
|
||||
layer: L.tileLayer("https://tile.informatievlaanderen.be/ws/raadpleegdiensten/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&" +
|
||||
"LAYER=omwrgbmrvl&STYLE=&FORMAT=image/png&tileMatrixSet=GoogleMapsVL&tileMatrix={z}&tileRow={y}&tileCol={x}",
|
||||
{
|
||||
// omwrgbmrvl
|
||||
attribution: 'Luchtfoto\'s van © AIV Vlaanderen (Laatste) © AGIV',
|
||||
maxZoom: 22,
|
||||
minZoom: 1,
|
||||
wmts: true
|
||||
})
|
||||
},
|
||||
BaseLayers.defaultLayer,
|
||||
{
|
||||
id: "aiv-13-15",
|
||||
name: "Luchtfoto Vlaanderen (2013-2015, door AIV)",
|
||||
layer: L.tileLayer.wms('https://geoservices.informatievlaanderen.be/raadpleegdiensten/OGW/wms?s',
|
||||
{
|
||||
maxZoom: 22,
|
||||
layers: "OGWRGB13_15VL",
|
||||
attribution: "Luchtfoto's van © AIV Vlaanderen (2013-2015) | "
|
||||
})
|
||||
},
|
||||
{
|
||||
id:"grb",
|
||||
name: "Kaart Grootschalig ReferentieBestand Vlaanderen (GRB) door AIV",
|
||||
layer: L.tileLayer("https://tile.informatievlaanderen.be/ws/raadpleegdiensten/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=grb_bsk&STYLE=&FORMAT=image/png&tileMatrixSet=GoogleMapsVL&tileMatrix={z}&tileCol={x}&tileRow={y}",
|
||||
{
|
||||
attribution: 'Achtergrond <i>Grootschalig ReferentieBestand</i>(GRB) © AGIV',
|
||||
maxZoom: 22,
|
||||
minZoom: 1,
|
||||
wmts: true
|
||||
})
|
||||
}
|
||||
]
|
||||
;*/
|
||||
|
||||
}
|
||||
|
||||
// Contains all setup and baselayers for Leaflet stuff
|
||||
export class Basemap {
|
||||
|
||||
|
||||
public static readonly defaultLayer: { name: string, layer: any, id: string } =
|
||||
Basemap.CreateBackgroundLayer("osm", "OpenStreetMap", "https://tile.openstreetmap.org/{z}/{x}/{y}.png",
|
||||
"<a href='https://openstreetmap.org/copyright' target='_blank'>OpenStreetMap (ODBL)</a>",
|
||||
"OpenStreetMap (ODBL)", 'https://openstreetmap.org/copyright',
|
||||
22, false);
|
||||
|
||||
// @ts-ignore
|
||||
|
@ -120,13 +75,12 @@ export class Basemap {
|
|||
});
|
||||
}
|
||||
|
||||
public static CreateBackgroundLayer(id: string, name: string, url: string, attribution: string,
|
||||
public static CreateBackgroundLayer(id: string, name: string, url: string, attribution: string, attributionUrl: string,
|
||||
maxZoom: number, isWms: boolean, isWMTS?: boolean) {
|
||||
|
||||
url = url.replace("{zoom}", "{z}")
|
||||
.replace("{proj}", "EPSG:3857")
|
||||
.replace("{width}", "256")
|
||||
.replace("{height}", "256")
|
||||
.replace("&BBOX={bbox}", "")
|
||||
.replace("&bbox={bbox}", "");
|
||||
|
||||
const subdomainsMatch = url.match(/{switch:[^}]*}/)
|
||||
let domains: string[] = [];
|
||||
|
@ -137,20 +91,48 @@ export class Basemap {
|
|||
url = url.replace(/{switch:[^}]*}/, "{s}")
|
||||
}
|
||||
|
||||
//geoservices.informatievlaanderen.be/raadpleegdiensten/dhmv/wms?FORMAT=image/jpeg&VERSION=1.1.1&SERVICE=WMS&REQUEST=GetMap&LAYERS=DHMV_II_SVF_25cm&STYLES=&SRS=EPSG:3857&WIDTH=256&HEIGHT=256
|
||||
|
||||
if (isWms) {
|
||||
url = url.replace("&SRS={proj}","");
|
||||
url = url.replace("&srs={proj}","");
|
||||
const paramaters = ["format", "layers", "version", "service", "request", "styles", "transparent", "version"];
|
||||
const urlObj = new URL(url);
|
||||
|
||||
const isUpper = urlObj.searchParams["LAYERS"] !== null;
|
||||
const options = {
|
||||
maxZoom: maxZoom ?? 19,
|
||||
attribution: attribution + " | ",
|
||||
subdomains: domains,
|
||||
uppercase: isUpper,
|
||||
transparent: false
|
||||
};
|
||||
|
||||
for (const paramater of paramaters) {
|
||||
let p = paramater;
|
||||
if (isUpper) {
|
||||
p = paramater.toUpperCase();
|
||||
}
|
||||
options[paramater] = urlObj.searchParams.get(p);
|
||||
}
|
||||
|
||||
if(options.transparent === null){
|
||||
options.transparent = false;
|
||||
}
|
||||
|
||||
|
||||
return {
|
||||
id: id,
|
||||
name: name,
|
||||
layer: L.tileLayer.wms(url,
|
||||
{
|
||||
maxZoom: maxZoom ?? 19,
|
||||
attribution: attribution + " | ",
|
||||
subdomains: domains
|
||||
})
|
||||
layer: L.tileLayer.wms(urlObj.protocol+"//"+urlObj.host+urlObj.pathname,
|
||||
options
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
if (attributionUrl) {
|
||||
attribution = `<a href='${attributionUrl}' target='_blank'>${attribution}</a>`;
|
||||
}
|
||||
|
||||
return {
|
||||
id: id,
|
||||
name: name,
|
||||
|
|
|
@ -156,6 +156,9 @@ TODO: erase cookies of third party websites and API's
|
|||
# Attributions
|
||||
|
||||
Data from OpenStreetMap
|
||||
|
||||
Background layer selection: curated by https://github.com/osmlab/editor-layer-index
|
||||
|
||||
Images from Wikipedia/Wikimedia
|
||||
|
||||
https://commons.wikimedia.org/wiki/File:Camera_font_awesome.svg
|
||||
|
|
2
State.ts
2
State.ts
|
@ -22,7 +22,7 @@ export class State {
|
|||
// The singleton of the global state
|
||||
public static state: State;
|
||||
|
||||
public static vNumber = "0.0.8g";
|
||||
public static vNumber = "0.0.8h";
|
||||
|
||||
// The user journey states thresholds when a new feature gets unlocked
|
||||
public static userJourney = {
|
||||
|
|
|
@ -121,7 +121,7 @@ export default class ValidatedTextField {
|
|||
const blacklistedTrackingParams = [
|
||||
"fbclid",// Oh god, how I hate the fbclid. Let it burn, burn in hell!
|
||||
"gclid",
|
||||
"cmpid", "agid", "utm", "utm_source"]
|
||||
"cmpid", "agid", "utm", "utm_source","utm_medium"]
|
||||
for (const dontLike of blacklistedTrackingParams) {
|
||||
url.searchParams.delete(dontLike)
|
||||
}
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -80,12 +80,12 @@
|
|||
"question": {
|
||||
"en": "On what webpage can one find more information about the Ghost bike or the accident?",
|
||||
"nl": "Op welke website kan men meer informatie vinden over de Witte fiets of over het ongeval?",
|
||||
"de": ""
|
||||
"de": "Auf welcher Webseite kann man mehr Informationen über das Geisterrad oder den Unfall finden?"
|
||||
},
|
||||
"render": {
|
||||
"en": "<a href='{source}' target='_blank'>More information is available</a>",
|
||||
"nl": "<a href='{source}' target='_blank'>Meer informatie</a>",
|
||||
"de": "Auf welcher Webseite kann man mehr Informationen über das Geisterrad oder den Unfall finden?"
|
||||
"de": "<a href='{source}' target='_blank'>Mehr Informationen</a>"
|
||||
},
|
||||
"freeform": {
|
||||
"type": "url",
|
||||
|
@ -106,6 +106,20 @@
|
|||
"freeform": {
|
||||
"key": "inscription"
|
||||
}
|
||||
},
|
||||
{
|
||||
"question": {
|
||||
"nl": "Wanneer werd deze witte fiets geplaatst?",
|
||||
"en": "When was this Ghost bike installed?"
|
||||
},
|
||||
"render": {
|
||||
"nl": "Geplaatst op {start_date}",
|
||||
"en": "Placed on {start_date}"
|
||||
},
|
||||
"freeform": {
|
||||
"key": "start_date",
|
||||
"type": "date"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
8
test.ts
8
test.ts
|
@ -1,5 +1,5 @@
|
|||
import AvailableBaseLayers from "./Logic/AvailableBaseLayers";
|
||||
import {Basemap} from "./Logic/Leaflet/Basemap";
|
||||
|
||||
|
||||
const layers = AvailableBaseLayers.AvailableLayersAt(51.2,3.2);
|
||||
console.log(layers);
|
||||
const input = "https://geoservices.informatievlaanderen.be/raadpleegdiensten/OGW/wms?FORMAT=image/jpeg&VERSION=1.1.1&SERVICE=WMS&REQUEST=GetMap&LAYERS=OGWRGB13_15VL&STYLES=&SRS={proj}&WIDTH={width}&HEIGHT={height}&BBOX={bbox}";
|
||||
const leafletLayer = Basemap.CreateBackgroundLayer("aiv", "AIV", input, "Attr", "http://osm.org", 22, true, false);
|
||||
console.log(leafletLayer)
|
|
@ -12,6 +12,7 @@ import Translations from "../UI/i18n/Translations";
|
|||
import {TagRenderingOptions} from "../Customizations/TagRenderingOptions";
|
||||
import {UIEventSource} from "../Logic/UIEventSource";
|
||||
import {TagRendering} from "../UI/TagRendering";
|
||||
import {Basemap} from "../Logic/Leaflet/Basemap";
|
||||
|
||||
|
||||
new T([
|
||||
|
@ -120,7 +121,5 @@ new T([
|
|||
equal(true, rendered.indexOf("Niet toegankelijk") > 0)
|
||||
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
],
|
||||
]);
|
||||
|
|
Loading…
Reference in a new issue