Style Spec for sky and fog (#298)

* Copy style-spec pieces from maplibre/maplibre-gl-js#1713 * add missing SkySpecification * fix lint error
maplibre · Jan 7, 2024 · c158082 · c158082
1 parent 86c4898
commit c158082
Show file tree

Hide file tree

Showing 6 changed files with 128 additions and 0 deletions.
diff --git a/build/generate-style-spec.ts b/build/generate-style-spec.ts
@@ -34,6 +34,8 @@ function propertyType(property) {
             }
             case 'light':
                 return 'LightSpecification';
+            case 'sky':
+                return 'SkySpecification';
             case 'sources':
                 return '{[_: string]: SourceSpecification}';
             case '*':
@@ -312,6 +314,8 @@ ${objectDeclaration('StyleSpecification', spec.$root)}
 
 ${objectDeclaration('LightSpecification', spec.light)}
 
+${objectDeclaration('SkySpecification', spec.sky)}
+
 ${objectDeclaration('TerrainSpecification', spec.terrain)}
 
 ${spec.source.map(key => {

diff --git a/src/reference/v8.json b/src/reference/v8.json
@@ -63,6 +63,13 @@
         "intensity": 0.4
       }
     },
+    "sky": {
+      "type": "sky",
+      "doc": "The map sky.",
+      "example": {
+          "sky-color": "#199EF3"
+      }
+    },
     "terrain": {
       "type": "terrain",
       "doc": "The terrain configuration.",
@@ -3902,6 +3909,84 @@
       }
     }
   },
+  "sky": {
+    "sky-color": {
+      "type": "color",
+      "property-type": "data-constant",
+      "default": "#88C6FC",
+      "expression": {
+        "interpolated": true,
+        "parameters": [
+          "zoom"
+        ]
+      },
+      "transition": true,
+      "doc": "Base color for sky.",
+      "sdk-support": {
+        "basic functionality": {
+          "js": "3.0.0"
+        }
+      }
+    },
+    "fog-color": {
+      "type": "color",
+      "property-type": "data-constant",
+      "default": "#ffffff",
+      "expression": {
+        "interpolated": true,
+        "parameters": [
+          "zoom"
+        ]
+      },
+      "transition": true,
+      "doc": "Base color for fog.",
+      "sdk-support": {
+        "basic functionality": {
+          "js": "3.0.0"
+        }
+      }
+    },
+    "fog-blend": {
+      "type": "number",
+      "property-type": "data-constant",
+      "default": 0.5,
+      "minimum": 0,
+      "maximum": 1,
+      "expression": {
+        "interpolated": true,
+        "parameters": [
+          "zoom"
+        ]
+      },
+      "transition": true,
+      "doc": "Blend fog over terrain3d. A value between 0 and 1. 0 is map center and 1 is the horizon",
+      "sdk-support": {
+        "basic functionality": {
+          "js": "3.0.0"
+        }
+      }
+    },
+    "horizon-blend": {
+      "type": "number",
+      "property-type": "data-constant",
+      "default": 0.8,
+      "minimum": 0,
+      "maximum": 1,
+      "expression": {
+        "interpolated": true,
+        "parameters": [
+          "zoom"
+        ]
+      },
+      "transition": true,
+      "doc": "Blend fog and sky color at horizon. A value between 0 and 1. 0 is the horizon and 1 is map-height / 2",
+      "sdk-support": {
+        "basic functionality": {
+          "js": "3.0.0"
+        }
+      }
+    }
+  },
   "terrain": {
     "source": {
       "type": "string",

diff --git a/src/validate/validate.ts b/src/validate/validate.ts
@@ -17,6 +17,7 @@ import validateFilter from './validate_filter';
 import validateLayer from './validate_layer';
 import validateSource from './validate_source';
 import validateLight from './validate_light';
+import validateSky from './validate_sky';
 import validateTerrain from './validate_terrain';
 import validateString from './validate_string';
 import validateFormatted from './validate_formatted';
@@ -41,6 +42,7 @@ const VALIDATORS = {
     'object': validateObject,
     'source': validateSource,
     'light': validateLight,
+    'sky': validateSky,
     'terrain': validateTerrain,
     'string': validateString,
     'formatted': validateFormatted,

diff --git a/src/validate/validate_sky.ts b/src/validate/validate_sky.ts
@@ -0,0 +1,34 @@
+import ValidationError from '../error/validation_error';
+import getType from '../util/get_type';
+import validate from './validate';
+
+export default function validateSky(options) {
+    const sky = options.value;
+    const styleSpec = options.styleSpec;
+    const skySpec = styleSpec.sky;
+    const style = options.style;
+
+    const rootType = getType(sky);
+    if (sky === undefined) {
+        return [];
+    } else if (rootType !== 'object') {
+        return [new ValidationError('sky', sky, `object expected, ${rootType} found`)];
+    }
+
+    let errors = [];
+    for (const key in sky) {
+        if (skySpec[key]) {
+            errors = errors.concat(validate({
+                key,
+                value: sky[key],
+                valueSpec: skySpec[key],
+                style,
+                styleSpec
+            }));
+        } else {
+            errors = errors.concat([new ValidationError(key, sky[key], `unknown property "${key}"`)]);
+        }
+    }
+
+    return errors;
+}
diff --git a/src/validate_style.min.ts b/src/validate_style.min.ts
@@ -5,6 +5,7 @@ import latestStyleSpec from './reference/latest';
 
 import validateSource from './validate/validate_source';
 import validateLight from './validate/validate_light';
+import validateSky from './validate/validate_sky';
 import validateTerrain from './validate/validate_terrain';
 import validateLayer from './validate/validate_layer';
 import validateFilter from './validate/validate_filter';
@@ -65,6 +66,7 @@ validateStyleMin.source = wrapCleanErrors(injectValidateSpec(validateSource));
 validateStyleMin.sprite = wrapCleanErrors(injectValidateSpec(validateSprite));
 validateStyleMin.glyphs = wrapCleanErrors(injectValidateSpec(validateGlyphsUrl));
 validateStyleMin.light = wrapCleanErrors(injectValidateSpec(validateLight));
+validateStyleMin.sky = wrapCleanErrors(injectValidateSpec(validateSky));
 validateStyleMin.terrain = wrapCleanErrors(injectValidateSpec(validateTerrain));
 validateStyleMin.layer = wrapCleanErrors(injectValidateSpec(validateLayer));
 validateStyleMin.filter = wrapCleanErrors(injectValidateSpec(validateFilter));

diff --git a/src/validate_style.ts b/src/validate_style.ts
@@ -34,6 +34,7 @@ export default function validateStyle(style: StyleSpecification | string | Buffe
 
 export const source = validateStyleMin.source;
 export const light = validateStyleMin.light;
+export const sky = validateStyleMin.sky;
 export const terrain = validateStyleMin.terrain;
 export const layer = validateStyleMin.layer;
 export const filter = validateStyleMin.filter;