diff --git a/src/components/inputs/FontInput.jsx b/src/components/inputs/FontInput.jsx
index dc29e3f1a..12c531da1 100644
--- a/src/components/inputs/FontInput.jsx
+++ b/src/components/inputs/FontInput.jsx
@@ -32,7 +32,7 @@ class FontInput extends React.Component {
/>
})
- return
+ return
{inputs}
}
diff --git a/src/config/tilesets.json b/src/config/tilesets.json
index 49beffaf8..1096f7507 100644
--- a/src/config/tilesets.json
+++ b/src/config/tilesets.json
@@ -18,9 +18,9 @@
"url": "https://free.tilehosting.com/data/v3.json?key=25ItXg7aI5wurYDtttD",
"title": "OpenMapTiles CDN"
},
- "swissnames-landscape": {
+ "naturalearth-airports": {
"type": "geojson",
- "data": "http://swissnames.lukasmartinelli.ch/data/landscape.geojson",
- "title": "Landscape Names GeoJSON"
+ "data": "https://d2ad6b4ur7yvpq.cloudfront.net/naturalearth-3.3.0/ne_10m_airports.geojson",
+ "title": "NaturalEarth Airports GeoJSON"
}
}
diff --git a/src/libs/layerwatcher.js b/src/libs/layerwatcher.js
index 0db31ec7c..1c12520b9 100644
--- a/src/libs/layerwatcher.js
+++ b/src/libs/layerwatcher.js
@@ -37,7 +37,7 @@ export default class LayerWatcher {
const previousVectorLayers = { ...this._vectorLayers }
Object.keys(this._sources).forEach(sourceId => {
- this._sources[sourceId].forEach(vectorLayerId => {
+ (this._sources[sourceId] || []).forEach(vectorLayerId => {
const knownProperties = this._vectorLayers[vectorLayerId] || {}
const params = { sourceLayer: vectorLayerId }
map.querySourceFeatures(sourceId, params).forEach(feature => {
diff --git a/src/libs/stylegen.js b/src/libs/stylegen.js
index 20c208082..f4decc535 100644
--- a/src/libs/stylegen.js
+++ b/src/libs/stylegen.js
@@ -27,10 +27,9 @@ function assignVectorLayerColor(layerId) {
}
function circleLayer(source, vectorLayer, color) {
- return {
+ const layer = {
id: `${source}_${vectorLayer}_circle`,
source: source,
- 'source-layer': vectorLayer,
type: 'circle',
paint: {
'circle-color': color,
@@ -38,13 +37,16 @@ function circleLayer(source, vectorLayer, color) {
},
filter: ["==", "$type", "Point"]
}
+ if(vectorLayer) {
+ layer['source-layer'] = vectorLayer
+ }
+ return layer
}
function polygonLayer(source, vectorLayer, color, fillColor) {
- return {
+ const layer = {
id: `${source}_${vectorLayer}_polygon`,
source: source,
- 'source-layer': vectorLayer,
type: 'fill',
paint: {
'fill-color': fillColor,
@@ -53,13 +55,16 @@ function polygonLayer(source, vectorLayer, color, fillColor) {
},
filter: ["==", "$type", "Polygon"]
}
+ if(vectorLayer) {
+ layer['source-layer'] = vectorLayer
+ }
+ return layer
}
function lineLayer(source, vectorLayer, color) {
- return {
+ const layer = {
id: `${source}_${vectorLayer}_line`,
source: source,
- 'source-layer': vectorLayer,
layout: {
'line-join': 'round',
'line-cap': 'round'
@@ -70,6 +75,10 @@ function lineLayer(source, vectorLayer, color) {
},
filter: ["==", "$type", "LineString"]
}
+ if(vectorLayer) {
+ layer['source-layer'] = vectorLayer
+ }
+ return layer
}
export function colorHighlightedLayer(layer) {
@@ -110,6 +119,16 @@ export function generateColoredLayers(sources) {
Object.keys(sources).forEach(sourceId => {
const layers = sources[sourceId]
+
+ // Deal with GeoJSON sources that do not have any source layers
+ if(!layers) {
+ const color = Color(assignVectorLayerColor(sourceId))
+ circleLayers.push(circleLayer(sourceId, null, color.alpha(0.3).string()))
+ lineLayers.push(lineLayer(sourceId, null, color.alpha(0.3).string()))
+ polyLayers.push(polygonLayer(sourceId, null, color.alpha(0.2).string(), color.alpha(0.05).string()))
+ return
+ }
+
layers.forEach(layerId => {
const color = Color(assignVectorLayerColor(layerId))
circleLayers.push(circleLayer(sourceId, layerId, color.alpha(0.3).string()))