symbol-clip: dynamic filter style spec changes

debug/index.html

@@ -26,36 +26,6 @@
     hash: true
 });
 
-map.once('load', () => {
-    map.setLayoutProperty('building-number-label', 'symbol-clip',
-    ["case",
-        ["<", ["pitch"], 60], false,
-        ["all", [">=", ["pitch"], 60], ["<", ["distance-from-center"], 2]], false,
-        true
-    ]
-    );
-
-    map.setLayoutProperty('poi-label', 'symbol-clip',
-        ["case",
-            ["<", ["pitch"], 60], false,
-            ["all", [">=", ["pitch"], 60], ["<", ["distance-from-center"], 4]], false,
-            true
-        ]
-    );
-
-    map.setLayoutProperty('transit-label', 'symbol-clip',
-    ["case",
-        ["<", ["pitch"], 60], false,
-        ["all", [">=", ["pitch"], 60], ["<", ["distance-from-center"], 3]], false,
-        true
-    ]
-    );
-
-    map.once('idle', () => {
-        map.panTo([-122.4199724, 37.7687162], {duration: 50000});
-    });
-});
-
 </script>
 </body>
 </html>

src/style-spec/expression/definitions/index.js

@@ -204,7 +204,7 @@ CompoundExpression.register(expressions, {
     'pitch': [
         NumberType,
         [],
-        (ctx) => ctx.globals.pitch
+        (ctx) => ctx.globals.pitch || 0
     ],
     'distance-from-center': [
         NumberType,

src/style-spec/expression/index.js

@@ -15,7 +15,7 @@ import definitions from './definitions/index.js';
 import * as isConstant from './is_constant.js';
 import RuntimeError from './runtime_error.js';
 import {success, error} from '../util/result.js';
-import {supportsPropertyExpression, supportsZoomExpression, supportsInterpolation, supportsCameraStateExpression} from '../util/properties.js';
+import {supportsPropertyExpression, supportsZoomExpression, supportsInterpolation} from '../util/properties.js';
 
 import type {Type, EvaluationKind} from './types.js';
 import type {Value} from './values.js';
@@ -41,7 +41,7 @@ export type FeatureState = {[_: string]: any};
 
 export type GlobalProperties = $ReadOnly<{
     zoom: number,
-    pitch: number,
+    pitch?: number,
     cameraDistanceMatrix?: number[],
     heatmapDensity?: number,
     lineProgress?: number,
@@ -191,24 +191,6 @@ export class ZoomDependentExpression<Kind: EvaluationKind> {
     }
 }
 
-export class CameraDependentExpression<Kind: EvaluationKind> {
-    kind: Kind;
-    _styleExpression: StyleExpression;
-
-    constructor(kind: Kind, expression: StyleExpression) {
-        this.kind = kind;
-        this._styleExpression = expression;
-    }
-
-    evaluateWithoutErrorHandling(globals: GlobalProperties, feature?: Feature, featureState?: FeatureState, canonical?: CanonicalTileID, availableImages?: Array<string>, formattedSection?: FormattedSection,): any {
-        return this._styleExpression.evaluateWithoutErrorHandling(globals, feature, featureState, canonical, availableImages, formattedSection);
-    }
-
-    evaluate(globals: GlobalProperties, feature?: Feature, featureState?: FeatureState, canonical?: CanonicalTileID, availableImages?: Array<string>, formattedSection?: FormattedSection, refLocation: MercatorCoordinate): any {
-        return this._styleExpression.evaluate(globals, feature, featureState, canonical, availableImages, formattedSection, refLocation);
-    }
-}
-
 export type ConstantExpression = {
     kind: 'constant',
     +evaluate: (globals: GlobalProperties, feature?: Feature, featureState?: FeatureState, canonical?: CanonicalTileID, availableImages?: Array<string>) => any,
@@ -237,23 +219,11 @@ export type CompositeExpression = {
     interpolationType: ?InterpolationType
 };
 
-export type CameraStateExpression = {
-    kind: 'camera',
-    +evaluate: (globals: GlobalProperties, feature?: Feature, featureState?: FeatureState, canonical?: CanonicalTileID, availableImages?: Array<string>) => any,
-};
-
-export type CompositeCameraStateExpression = {
-    kind: 'composite',
-    +evaluate: (globals: GlobalProperties, feature?: Feature, featureState?: FeatureState, canonical?: CanonicalTileID, availableImages?: Array<string>, formattedSection?: FormattedSection, refLocation?: MercatorCoordinate) => any,
-};
-
 export type StylePropertyExpression =
     | ConstantExpression
     | SourceExpression
     | CameraExpression
-    | CompositeExpression
-    | CameraStateExpression
-    | CompositeCameraStateExpression;
+    | CompositeExpression;
 
 export function createPropertyExpression(expression: mixed, propertySpec: StylePropertySpecification): Result<StylePropertyExpression, Array<ParsingError>> {
     expression = createExpression(expression, propertySpec);
@@ -273,12 +243,6 @@ export function createPropertyExpression(expression: mixed, propertySpec: StyleP
         return error([new ParsingError('', 'zoom expressions not supported')]);
     }
 
-    if (supportsCameraStateExpression(propertySpec)) {
-        return success(isFeatureConstant ?
-            (new CameraDependentExpression('composite', expression.value): CameraStateExpression) :
-            (new CameraDependentExpression('composite', expression.value): CompositeCameraStateExpression));
-    }
-
     const zoomCurve = findZoomCurve(parsed);
     if (!zoomCurve && !isZoomConstant) {
         return error([new ParsingError('', '"zoom" expression may only be used as input to a top-level "step" or "interpolate" expression.')]);

src/style-spec/feature_filter/index.js

@@ -1,12 +1,13 @@
 // @flow
 
 import {createExpression} from '../expression/index.js';
+import latest from '../reference/latest.js';
 import type {GlobalProperties, Feature} from '../expression/index.js';
 import type {CanonicalTileID} from '../../source/tile_id.js';
 import type MercatorCoordinate from '../../geo/mercator_coordinate.js';
 
-type FilterExpression = (globalProperties: GlobalProperties, feature: Feature, canonical?: CanonicalTileID) => boolean;
-export type FeatureFilter = {filter: FilterExpression, dynamicFilter: FilterExpression, needGeometry: boolean};
+type FilterExpression = (globalProperties: GlobalProperties, feature: Feature, canonical?: CanonicalTileID, refLocation?: MercatorCoordinate) => boolean;
+export type FeatureFilter = {filter: FilterExpression, dynamicFilter?: FilterExpression, needGeometry: boolean};
 
 export default createFilter;
 export {isExpressionFilter, isDynamicFilter, extractStaticFilter};
@@ -53,75 +54,75 @@ function isExpressionFilter(filter: any) {
     }
 }
 
-const filterSpec = {
-    'type': 'boolean',
-    'default': false,
-    'transition': false,
-    'property-type': 'data-driven',
-    'expression': {
-        'interpolated': false,
-        'parameters': ['zoom', 'feature', 'pitch', 'distance-from-center']
-    }
-};
-
 /**
  * Given a filter expressed as nested arrays, return a new function
  * that evaluates whether a given feature (with a .properties or .tags property)
  * passes its test.
  *
  * @private
  * @param {Array} filter mapbox gl filter
+ * @param {string} layerType the type of the layer this filter will be applied to.
  * @returns {Function} filter-evaluating function
  */
-function createFilter(filter: any): FeatureFilter {
+function createFilter(filter: any, layerType?: string = 'fill'): FeatureFilter {
     if (filter === null || filter === undefined) {
-        return {filter: () => true, dynamicFilter: () => true, needGeometry: false};
+        return {filter: () => true, needGeometry: false};
     }
 
     if (!isExpressionFilter(filter)) {
         filter = convertFilter(filter);
     }
+    const filterExp = ((filter: any): string[] | string | boolean);
 
     let staticFilter = true;
     try {
-        staticFilter = extractStaticFilter(filter);
+        staticFilter = extractStaticFilter(filterExp);
     } catch (e) {
         console.warn(
 `Failed to extract static filter. Filter will continue working, but at higher memory usage and slower framerate.
 This is most likely a bug, please report this via https://github.com/mapbox/mapbox-gl-js/issues/new?assignees=&labels=&template=Bug_report.md
 and paste the contents of this message in the report.
 Thank you!
 Filter Expression:
-${JSON.stringify(filter, null, 2)}
+${JSON.stringify(filterExp, null, 2)}
         `);
     }
-    const dynamicFilter = filter === staticFilter ? true : filter;
 
+    // Compile the static component of the filter
+    const filterSpec = latest[`filter_${layerType}`];
     const compiledStaticFilter = createExpression(staticFilter, filterSpec);
-    const compiledDynamicFilter = createExpression(dynamicFilter, filterSpec);
-    if (compiledStaticFilter.result === 'error' || compiledDynamicFilter.result === 'error') {
-        const staticFilterErrors = compiledStaticFilter.result === 'error' ?
-            compiledStaticFilter.value.map(err => `${err.key}: ${err.message}`).join(', ') :
-            'None';
-
-        const dynamicFilterErrors = compiledDynamicFilter.result === 'error' ?
-            compiledDynamicFilter.value.map(err => `${err.key}: ${err.message}`).join(', ') :
-            'None';
-
-        const errorMsg = `static-filter errors:
-            ${staticFilterErrors}
-
-            dynamic-filter errors:
-            ${dynamicFilterErrors}
-        `;
-        throw new Error(errorMsg);
+
+    let filterFunc = null;
+    if (compiledStaticFilter.result === 'error') {
+        throw new Error(compiledStaticFilter.value.map(err => `${err.key}: ${err.message}`).join(', '));
     } else {
+        filterFunc = (globalProperties: GlobalProperties, feature: Feature, canonical?: CanonicalTileID) => compiledStaticFilter.value.evaluate(globalProperties, feature, {}, canonical);
+    }
+
+    // If the static component is not equal to the entire filter then we have a dynamic component
+    // Compile the dynamic component separately
+    let dynamicFilterFunc = null;
+    if (staticFilter !== filterExp) {
+        const compiledDynamicFilter = createExpression(filterExp, filterSpec);
+
+        if (compiledDynamicFilter.result === 'error') {
+            throw new Error(compiledDynamicFilter.value.map(err => `${err.key}: ${err.message}`).join(', '));
+        } else {
+            dynamicFilterFunc = (globalProperties: GlobalProperties, feature: Feature, canonical?: CanonicalTileID, refLocation?: MercatorCoordinate) => compiledDynamicFilter.value.evaluate(globalProperties, feature, {}, canonical, undefined, undefined, refLocation);
+        }
+    }
+
+    if (filterFunc) {
         const needGeometry = geometryNeeded(staticFilter);
+
         return {
-            filter: (globalProperties: GlobalProperties, feature: Feature, canonical?: CanonicalTileID) => compiledStaticFilter.value.evaluate(globalProperties, feature, {}, canonical),
-            dynamicFilter: (globalProperties: GlobalProperties, feature: Feature, canonical?: CanonicalTileID, refLocation: ?MercatorCoordinate) => compiledDynamicFilter.value.evaluate(globalProperties, feature, {}, canonical, null, null, refLocation),
+            filter: filterFunc,
+            dynamicFilter: dynamicFilterFunc ? dynamicFilterFunc : undefined,
             needGeometry
         };
+    } else {
+        // This branch cannot happen but need to keep flow happy :(
+        return {filter: () => true, needGeometry: false};
     }
 }
 
@@ -155,30 +156,6 @@ function collapseDynamicBooleanExpressions(expression: any): any {
     }
 }
 
-const dynamicConditionExpressions = new Set([
-    'in',
-    '==',
-    '!=',
-    '>',
-    '>=',
-    '<',
-    '<=',
-    'to-boolean'
-]);
-
-function collapsedExpression(expression: any): any {
-    if (dynamicConditionExpressions.has(expression[0])) {
-
-        for (let i = 1; i < expression.length; i++) {
-            const param = expression[i];
-            if (isDynamicFilter(param)) {
-                return true;
-            }
-        }
-    }
-    return expression;
-}
-
 /**
  * Traverses the expression and replaces all instances of branching on a
  * `dynamic` conditional (such as `['pitch']` or `['distance-from-center']`)
@@ -249,6 +226,30 @@ function isRootExpressionDynamic(expression: string): boolean {
         expression === 'distance-from-center';
 }
 
+const dynamicConditionExpressions = new Set([
+    'in',
+    '==',
+    '!=',
+    '>',
+    '>=',
+    '<',
+    '<=',
+    'to-boolean'
+]);
+
+function collapsedExpression(expression: any): any {
+    if (dynamicConditionExpressions.has(expression[0])) {
+
+        for (let i = 1; i < expression.length; i++) {
+            const param = expression[i];
+            if (isDynamicFilter(param)) {
+                return true;
+            }
+        }
+    }
+    return expression;
+}
+
 // Comparison function to sort numbers and strings
 function compare(a, b) {
     return a < b ? -1 : a > b ? 1 : 0;