@mapwhit/tilerenderer 1.2.0 → 1.2.2

package/src/style/query_utils.js

@@ -1,4 +1,8 @@
-import Point from '@mapbox/point-geometry';
+import glMatrix from '@mapbox/gl-matrix';
+import { polygonIntersectsBufferedPoint } from '@mapwhit/geometry';
+import { Point } from '@mapwhit/point-geometry';
+
+const { vec4 } = glMatrix;
 
 export function getMaximumPaintValue(property, layer, bucket) {
   const value = layer._paint.get(property).value;
@@ -18,16 +22,87 @@ export function translate(queryGeometry, translate, translateAnchor, bearing, pi
     return queryGeometry;
   }
 
-  const pt = Point.convert(translate)._mult(pixelsToTileUnits);
+  const pt = new Point(translate[0], translate[1])._mult(pixelsToTileUnits);
 
   if (translateAnchor === 'viewport') {
     pt._rotate(-bearing);
   }
 
-  const translated = [];
-  for (let i = 0; i < queryGeometry.length; i++) {
-    const point = queryGeometry[i];
-    translated.push(point.sub(pt));
+  pt;
+
+  return queryGeometry.map(point => point.sub(pt));
+}
+
+const circleIntersectionTests = new Map([
+  [
+    'map',
+    new Map([
+      [
+        'map',
+        ({ queryGeometry, point, size }) => {
+          return polygonIntersectsBufferedPoint(queryGeometry, point, size);
+        }
+      ],
+      [
+        'viewport',
+        ({ queryGeometry, point, pixelPosMatrix, size, transform }) => {
+          const projectedCenter = vec4.transformMat4([], [point.x, point.y, 0, 1], pixelPosMatrix);
+          const adjustedSize = (size * projectedCenter[3]) / transform.cameraToCenterDistance;
+          return polygonIntersectsBufferedPoint(queryGeometry, point, adjustedSize);
+        }
+      ]
+    ])
+  ],
+  [
+    'viewport',
+    new Map([
+      [
+        'map',
+        ({ queryGeometry, point, pixelPosMatrix, size, transform }) => {
+          const projectedCenter = vec4.transformMat4([], [point.x, point.y, 0, 1], pixelPosMatrix);
+          const adjustedSize = (size * transform.cameraToCenterDistance) / projectedCenter[3];
+          return polygonIntersectsBufferedPoint(queryGeometry, projectPoint(point, pixelPosMatrix), adjustedSize);
+        }
+      ],
+      [
+        'viewport',
+        ({ queryGeometry, point, pixelPosMatrix, size }) => {
+          return polygonIntersectsBufferedPoint(queryGeometry, projectPoint(point, pixelPosMatrix), size);
+        }
+      ]
+    ])
+  ]
+]);
+
+export function circleIntersection({
+  queryGeometry,
+  geometry,
+  pixelPosMatrix,
+  size,
+  transform,
+  pitchAlignment = 'map',
+  pitchScale = 'map'
+}) {
+  const intersectionTest = circleIntersectionTests.get(pitchAlignment).get(pitchScale);
+  const param = { queryGeometry, pixelPosMatrix, size, transform };
+  for (const ring of geometry) {
+    for (const point of ring) {
+      param.point = point;
+      if (intersectionTest(param)) {
+        return true;
+      }
+    }
   }
-  return translated;
+  return false;
+}
+
+function projectPoint(p, pixelPosMatrix) {
+  const point = vec4.transformMat4([], [p.x, p.y, 0, 1], pixelPosMatrix);
+  return new Point(point[0] / point[3], point[1] / point[3]);
+}
+
+export function projectQueryGeometry(queryGeometry, pixelPosMatrix) {
+  return queryGeometry.map(p => {
+    return projectPoint(p, pixelPosMatrix);
+  });
 }

package/src/style/style.js

@@ -920,8 +920,9 @@ class Style extends Evented {
     }
 
     const sourceResults = [];
+    params = params ? { ...params, globalState: this._globalState } : { globalState: this._globalState };
     for (const id in this._sources) {
-      if (params.layers && !includedSources[id]) {
+      if (params?.layers && !includedSources[id]) {
         continue;
       }
       sourceResults.push(
@@ -948,7 +949,12 @@ class Style extends Evented {
 
   querySourceFeatures(sourceID, params) {
     const sourceCache = this._sources[sourceID];
-    return sourceCache ? querySourceFeatures(sourceCache, params) : [];
+    return sourceCache
+      ? querySourceFeatures(
+          sourceCache,
+          params ? { ...params, globalState: this._globalState } : { globalState: this._globalState }
+        )
+      : [];
   }
 
   getLight() {

package/src/style/style_layer/circle_style_layer.js

@@ -1,14 +1,15 @@
-import glMatrix from '@mapbox/gl-matrix';
-import Point from '@mapbox/point-geometry';
-import { polygonIntersectsBufferedPoint } from '@mapwhit/geometry';
 import CircleBucket from '../../data/bucket/circle_bucket.js';
-import { getMaximumPaintValue, translate, translateDistance } from '../query_utils.js';
+import {
+  circleIntersection,
+  getMaximumPaintValue,
+  projectQueryGeometry,
+  translate,
+  translateDistance
+} from '../query_utils.js';
 import StyleLayer from '../style_layer.js';
 import properties from './circle_style_layer_properties.js';
 
-const { vec4 } = glMatrix;
-
-class CircleStyleLayer extends StyleLayer {
+export default class CircleStyleLayer extends StyleLayer {
   constructor(layer, globalState) {
     super(layer, properties, globalState);
   }
@@ -51,48 +52,28 @@ class CircleStyleLayer extends StyleLayer {
     // // Otherwise, compare geometry in the plane of the viewport
     // // A circle with fixed scaling relative to the viewport gets larger in tile space as it moves into the distance
     // // A circle with fixed scaling relative to the map gets smaller in viewport space as it moves into the distance
+
     const pitchScale = this._paint.get('circle-pitch-scale');
     const pitchAlignment = this._paint.get('circle-pitch-alignment');
-    const alignWithMap = pitchAlignment === 'map';
-    const alignWithViewport = pitchAlignment === 'viewport';
-    const transformedPolygon = alignWithMap
-      ? translatedPolygon
-      : projectQueryGeometry(translatedPolygon, pixelPosMatrix);
-    const transformedSize = alignWithMap ? size * pixelsToTileUnits : size;
-    const adjustViewportToMap = pitchScale === 'viewport' && alignWithMap;
-    const adjustMapToViewport = pitchScale === 'map' && alignWithViewport;
-
-    for (const ring of geometry) {
-      for (const point of ring) {
-        const transformedPoint = alignWithMap ? point : projectPoint(point, pixelPosMatrix);
 
-        let adjustedSize = transformedSize;
-        const projectedCenter = vec4.transformMat4([], [point.x, point.y, 0, 1], pixelPosMatrix);
-        if (adjustViewportToMap) {
-          adjustedSize *= projectedCenter[3] / transform.cameraToCenterDistance;
-        } else if (adjustMapToViewport) {
-          adjustedSize *= transform.cameraToCenterDistance / projectedCenter[3];
-        }
-
-        if (polygonIntersectsBufferedPoint(transformedPolygon, transformedPoint, adjustedSize)) {
-          return true;
-        }
-      }
+    let transformedPolygon;
+    let transformedSize;
+    if (pitchAlignment === 'map') {
+      transformedPolygon = translatedPolygon;
+      transformedSize = size * pixelsToTileUnits;
+    } else {
+      transformedPolygon = projectQueryGeometry(translatedPolygon, pixelPosMatrix);
+      transformedSize = size;
     }
 
-    return false;
+    return circleIntersection({
+      queryGeometry: transformedPolygon,
+      geometry,
+      pixelPosMatrix,
+      size: transformedSize,
+      transform,
+      pitchAlignment,
+      pitchScale
+    });
   }
 }
-
-function projectPoint(p, pixelPosMatrix) {
-  const point = vec4.transformMat4([], [p.x, p.y, 0, 1], pixelPosMatrix);
-  return new Point(point[0] / point[3], point[1] / point[3]);
-}
-
-function projectQueryGeometry(queryGeometry, pixelPosMatrix) {
-  return queryGeometry.map(p => {
-    return projectPoint(p, pixelPosMatrix);
-  });
-}
-
-export default CircleStyleLayer;

package/src/style/style_layer/fill_extrusion_style_layer.js

@@ -1,6 +1,6 @@
 import glMatrix from '@mapbox/gl-matrix';
-import Point from '@mapbox/point-geometry';
 import { polygonIntersectsMultiPolygon, polygonIntersectsPolygon } from '@mapwhit/geometry';
+import { clone, equals, sub } from '@mapwhit/point-geometry';
 import FillExtrusionBucket from '../../data/bucket/fill_extrusion_bucket.js';
 import { translate, translateDistance } from '../query_utils.js';
 import StyleLayer from '../style_layer.js';
@@ -45,11 +45,9 @@ export class FillExtrusionStyleLayer extends StyleLayer {
     const height = this._paint.get('fill-extrusion-height').evaluate(feature, featureState);
     const base = this._paint.get('fill-extrusion-base').evaluate(feature, featureState);
 
-    const projectedQueryGeometry = projectQueryGeometry(translatedPolygon, pixelPosMatrix, transform, 0);
+    const projectedQueryGeometry = projectQueryGeometry(translatedPolygon, pixelPosMatrix, 0);
 
-    const projected = projectExtrusion(geometry, base, height, pixelPosMatrix);
-    const projectedBase = projected[0];
-    const projectedTop = projected[1];
+    const { projectedBase, projectedTop } = projectExtrusion(geometry, base, height, pixelPosMatrix);
     return checkIntersection(projectedBase, projectedTop, projectedQueryGeometry);
   }
 }
@@ -72,7 +70,7 @@ export function getIntersectionDistance(projectedQueryGeometry, projectedFace) {
     let i = 0;
     const a = projectedFace[i++];
     let b;
-    while (!b || a.equals(b)) {
+    while (!b || equals(a, b)) {
       b = projectedFace[i++];
       if (!b) {
         return Number.POSITIVE_INFINITY;
@@ -84,9 +82,9 @@ export function getIntersectionDistance(projectedQueryGeometry, projectedFace) {
       const c = projectedFace[i];
       const p = projectedQueryGeometry[0];
 
-      const ab = b.sub(a);
-      const ac = c.sub(a);
-      const ap = p.sub(a);
+      const ab = sub(clone(b), a);
+      const ac = sub(clone(c), a);
+      const ap = sub(clone(p), a);
 
       const dotABAB = dot(ab, ab);
       const dotABAC = dot(ab, ac);
@@ -153,8 +151,8 @@ function checkIntersection(projectedBase, projectedTop, projectedQueryGeometry)
  * performance improvement.
  */
 function projectExtrusion(geometry, zBase, zTop, m) {
-  const projectedBase = [];
-  const projectedTop = [];
+  const projectedBase = new Array(geometry.length);
+  const projectedTop = new Array(geometry.length);
 
   const baseXZ = m[8] * zBase;
   const baseYZ = m[9] * zBase;
@@ -165,12 +163,12 @@ function projectExtrusion(geometry, zBase, zTop, m) {
   const topZZ = m[10] * zTop;
   const topWZ = m[11] * zTop;
 
-  for (const r of geometry) {
-    const ringBase = [];
-    const ringTop = [];
-    for (const p of r) {
-      const x = p.x;
-      const y = p.y;
+  for (let i = 0; i < geometry.length; i++) {
+    const ring = geometry[i];
+    const ringBase = new Array(ring.length);
+    const ringTop = new Array(ring.length);
+    for (let j = 0; j < ring.length; j++) {
+      const { x, y } = ring[j];
 
       const sX = m[0] * x + m[4] * y + m[12];
       const sY = m[1] * x + m[5] * y + m[13];
@@ -181,32 +179,27 @@ function projectExtrusion(geometry, zBase, zTop, m) {
       const baseY = sY + baseYZ;
       const baseZ = sZ + baseZZ;
       const baseW = sW + baseWZ;
+      ringBase[j] = { x: baseX / baseW, y: baseY / baseW, z: baseZ / baseW };
 
       const topX = sX + topXZ;
       const topY = sY + topYZ;
       const topZ = sZ + topZZ;
       const topW = sW + topWZ;
-
-      const b = new Point(baseX / baseW, baseY / baseW);
-      b.z = baseZ / baseW;
-      ringBase.push(b);
-
-      const t = new Point(topX / topW, topY / topW);
-      t.z = topZ / topW;
-      ringTop.push(t);
+      ringTop[j] = { x: topX / topW, y: topY / topW, z: topZ / topW };
     }
-    projectedBase.push(ringBase);
-    projectedTop.push(ringTop);
+    projectedBase[i] = ringBase;
+    projectedTop[i] = ringTop;
   }
-  return [projectedBase, projectedTop];
+  return { projectedBase, projectedTop };
 }
 
-function projectQueryGeometry(queryGeometry, pixelPosMatrix, transform, z) {
-  const projectedQueryGeometry = [];
-  for (const p of queryGeometry) {
-    const v = [p.x, p.y, z, 1];
+function projectQueryGeometry(queryGeometry, pixelPosMatrix, z) {
+  const projectedQueryGeometry = new Array(queryGeometry.length);
+  for (let i = 0; i < queryGeometry.length; i++) {
+    const { x, y } = queryGeometry[i];
+    const v = [x, y, z, 1];
     vec4.transformMat4(v, v, pixelPosMatrix);
-    projectedQueryGeometry.push(new Point(v[0] / v[3], v[1] / v[3]));
+    projectedQueryGeometry[i] = { x: v[0] / v[3], y: v[1] / v[3] };
   }
   return projectedQueryGeometry;
 }

package/src/style/style_layer/heatmap_style_layer.js

@@ -1,9 +1,10 @@
 import HeatmapBucket from '../../data/bucket/heatmap_bucket.js';
 import renderColorRamp from '../../util/color_ramp.js';
+import { circleIntersection, getMaximumPaintValue } from '../query_utils.js';
 import StyleLayer from '../style_layer.js';
 import properties from './heatmap_style_layer_properties.js';
 
-class HeatmapStyleLayer extends StyleLayer {
+export default class HeatmapStyleLayer extends StyleLayer {
   createBucket(options) {
     return new HeatmapBucket(options);
   }
@@ -34,17 +35,30 @@ class HeatmapStyleLayer extends StyleLayer {
     }
   }
 
-  queryRadius() {
-    return 0;
+  queryRadius(bucket) {
+    return getMaximumPaintValue('heatmap-radius', this, bucket);
   }
 
-  queryIntersectsFeature() {
-    return false;
+  queryIntersectsFeature(
+    queryGeometry,
+    feature,
+    featureState,
+    geometry,
+    zoom,
+    transform,
+    pixelsToTileUnits,
+    pixelPosMatrix
+  ) {
+    return circleIntersection({
+      queryGeometry,
+      geometry,
+      pixelPosMatrix,
+      size: this._paint.get('heatmap-radius').evaluate(feature, featureState) * pixelsToTileUnits,
+      transform
+    });
   }
 
   hasOffscreenPass() {
     return this._paint.get('heatmap-opacity') !== 0 && !this.isHidden();
   }
 }
-
-export default HeatmapStyleLayer;

package/src/style/style_layer/line_style_layer.js

@@ -1,5 +1,5 @@
-import Point from '@mapbox/point-geometry';
 import { polygonIntersectsBufferedMultiLine } from '@mapwhit/geometry';
+import { add, clone, div, mult, perp, sub, unit } from '@mapwhit/point-geometry';
 import LineBucket from '../../data/bucket/line_bucket.js';
 import renderColorRamp from '../../util/color_ramp.js';
 import EvaluationParameters from '../evaluation_parameters.js';
@@ -111,22 +111,22 @@ function offsetLine(rings, offset) {
     newRings[k] = newRing;
 
     let b = ring[0];
-    let aToB = new Point(0, 0);
+    let aToB = { x: 0, y: 0 };
     for (let i = 0; i < ring.length - 1; i++) {
       const c = ring[i + 1];
-      const bToC = c.sub(b)._unit()._perp();
-      const extrude = aToB._add(bToC)._unit();
+      const bToC = perp(unit(sub(clone(c), b)));
+      const extrude = unit(add(aToB, bToC));
       const cosHalfAngle = extrude.x * bToC.x + extrude.y * bToC.y;
       if (cosHalfAngle !== 0) {
-        extrude._div(cosHalfAngle);
+        div(extrude, cosHalfAngle);
       }
-      newRing[i] = extrude._mult(offset)._add(b);
+      newRing[i] = add(mult(extrude, offset), b);
 
       b = c;
       aToB = bToC;
     }
 
-    newRing[ring.length - 1] = aToB._unit()._mult(offset)._add(b);
+    newRing[ring.length - 1] = add(mult(unit(aToB), offset), b);
   }
   return newRings;
 }

package/src/style/style_layer.js

@@ -35,10 +35,10 @@ class StyleLayer extends Evented {
       this.source = layer.source;
       this['source-layer'] = this.sourceLayer = layer['source-layer'];
       this.filter = layer.filter;
-      this._featureFilter = featureFilter(layer.filter);
+      this._featureFilter = featureFilter(layer.filter, globalState);
     }
 
-    this._featureFilter ??= featureFilter.addGlobalStateRefs(() => true);
+    this._featureFilter ??= featureFilter(undefined, globalState);
 
     if (properties.layout) {
       this._unevaluatedLayout = new Layout(properties.layout, globalState);
@@ -59,7 +59,7 @@ class StyleLayer extends Evented {
   setFilter(filter) {
     this.#key = undefined;
     this.filter = filter;
-    this._featureFilter = featureFilter(filter);
+    this._featureFilter.setValue(filter);
   }
 
   _setZoomRange(minzoom, maxzoom) {

package/src/style-spec/feature_filter/index.js

@@ -64,29 +64,34 @@ const filterSpec = {
  * @returns {Function} filter-evaluating function
  */
 export default function createFilter(filter, globalState) {
-  if (filter === null || filter === undefined) {
-    return addGlobalStateRefs(() => true);
+  let evaluate;
+  const expression = (globalProperties, feature) => evaluate(globalProperties, feature);
+  expression.setValue = setValue;
+  setValue(filter);
+  return expression;
+
+  function setValue(filter) {
+    if (filter === null || filter === undefined) {
+      evaluate = () => true;
+      addGlobalStateRefs(expression);
+      return;
+    }
+
+    if (!isExpressionFilter(filter)) {
+      filter = convertFilter(filter);
+    }
+
+    const compiled = createExpression(filter, filterSpec, globalState);
+    if (compiled.result === 'error') {
+      throw new Error(compiled.value.map(err => `${err.key}: ${err.message}`).join(', '));
+    }
+    evaluate = (globalProperties, feature) => compiled.value.evaluate(globalProperties, feature);
+    addGlobalStateRefs(expression, () => findGlobalStateRefs(compiled.value.expression));
   }
-
-  if (!isExpressionFilter(filter)) {
-    filter = convertFilter(filter);
-  }
-
-  const compiled = createExpression(filter, filterSpec, globalState);
-  if (compiled.result === 'error') {
-    throw new Error(compiled.value.map(err => `${err.key}: ${err.message}`).join(', '));
-  }
-  return Object.assign(
-    addGlobalStateRefs(
-      (globalProperties, feature) => compiled.value.evaluate(globalProperties, feature),
-      () => findGlobalStateRefs(compiled.value.expression)
-    )
-  );
 }
 
-export function addGlobalStateRefs(filter, getGlobalStateRefs = () => new Set()) {
+function addGlobalStateRefs(filter, getGlobalStateRefs = () => new Set()) {
   filter.getGlobalStateRefs = getGlobalStateRefs;
-  return filter;
 }
 
 // Comparison function to sort numbers and strings

package/src/symbol/anchor.js

@@ -1,4 +1,4 @@
-import Point from '@mapbox/point-geometry';
+import { Point } from '@mapwhit/point-geometry';
 
 class Anchor extends Point {
   constructor(x, y, angle, segment) {

package/src/symbol/check_max_angle.js

@@ -1,4 +1,4 @@
-export default checkMaxAngle;
+import { angleTo, dist } from '@mapwhit/point-geometry';
 
 /**
  * Labels placed around really sharp angles aren't readable. Check if any
@@ -13,7 +13,7 @@ export default checkMaxAngle;
  * @returns {boolean} whether the label should be placed
  * @private
  */
-function checkMaxAngle(line, anchor, labelLength, windowSize, maxAngle) {
+export default function checkMaxAngle(line, anchor, labelLength, windowSize, maxAngle) {
   // horizontal labels always pass
   if (anchor.segment === undefined) {
     return true;
@@ -32,11 +32,11 @@ function checkMaxAngle(line, anchor, labelLength, windowSize, maxAngle) {
       return false;
     }
 
-    anchorDistance -= line[index].dist(p);
+    anchorDistance -= dist(line[index], p);
     p = line[index];
   }
 
-  anchorDistance += line[index].dist(line[index + 1]);
+  anchorDistance += dist(line[index], line[index + 1]);
   index++;
 
   // store recent corners and their total angle difference
@@ -54,7 +54,7 @@ function checkMaxAngle(line, anchor, labelLength, windowSize, maxAngle) {
       return false;
     }
 
-    let angleDelta = prev.angleTo(current) - current.angleTo(next);
+    let angleDelta = angleTo(prev, current) - angleTo(current, next);
     // restrict angle to -pi..pi range
     angleDelta = Math.abs(((angleDelta + 3 * Math.PI) % (Math.PI * 2)) - Math.PI);
 
@@ -75,7 +75,7 @@ function checkMaxAngle(line, anchor, labelLength, windowSize, maxAngle) {
     }
 
     index++;
-    anchorDistance += current.dist(next);
+    anchorDistance += dist(current, next);
   }
 
   // no part of the line had an angle greater than the maximum allowed. check passes.

package/src/symbol/collision_feature.js

@@ -1,4 +1,4 @@
-import Point from '@mapbox/point-geometry';
+import { dist, Point, rotate as rotatePoint } from '@mapwhit/point-geometry';
 
 /**
  * A CollisionFeature represents the area of the tile covered by a single label.
@@ -67,17 +67,11 @@ class CollisionFeature {
         // See https://github.com/mapbox/mapbox-gl-js/issues/6075
         // Doesn't account for icon-text-fit
 
-        const tl = new Point(x1, y1);
-        const tr = new Point(x2, y1);
-        const bl = new Point(x1, y2);
-        const br = new Point(x2, y2);
-
         const rotateRadians = (rotate * Math.PI) / 180;
-
-        tl._rotate(rotateRadians);
-        tr._rotate(rotateRadians);
-        bl._rotate(rotateRadians);
-        br._rotate(rotateRadians);
+        const tl = rotatePoint({ x: x1, y: y1 }, rotateRadians);
+        const tr = rotatePoint({ x: x2, y: y1 }, rotateRadians);
+        const bl = rotatePoint({ x: x1, y: y2 }, rotateRadians);
+        const br = rotatePoint({ x: x2, y: y2 }, rotateRadians);
 
         // Collision features require an "on-axis" geometry,
         // so take the envelope of the rotated geometry
@@ -162,11 +156,11 @@ class CollisionFeature {
         index = 0;
         break;
       }
-      anchorDistance -= line[index].dist(p);
+      anchorDistance -= dist(line[index], p);
       p = line[index];
     } while (anchorDistance > paddingStartDistance);
 
-    let segmentLength = line[index].dist(line[index + 1]);
+    let segmentLength = dist(line[index], line[index + 1]);
 
     for (let i = -nPitchPaddingBoxes; i < nBoxes + nPitchPaddingBoxes; i++) {
       // the distance the box will be from the anchor
@@ -197,7 +191,7 @@ class CollisionFeature {
           return;
         }
 
-        segmentLength = line[index].dist(line[index + 1]);
+        segmentLength = dist(line[index], line[index + 1]);
       }
 
       // the distance the box will be from the beginning of the segment
@@ -205,7 +199,7 @@ class CollisionFeature {
 
       const p0 = line[index];
       const p1 = line[index + 1];
-      const boxAnchorPoint = p1.sub(p0)._unit()._mult(segmentBoxDistance)._add(p0)._round();
+      const boxAnchorPoint = Point.clone(p1)._sub(p0)._unit()._mult(segmentBoxDistance)._add(p0)._round();
 
       // If the box is within boxSize of the anchor, force the box to be used
       // (so even 0-width labels use at least one box)