@mapwhit/tilerenderer 1.0.0 → 1.1.0

package/src/style/pauseable_placement.js

@@ -1,6 +1,5 @@
-const browser = require('../util/browser');
-
-const { Placement } = require('../symbol/placement');
+import { Placement } from '../symbol/placement.js';
+import browser from '../util/browser.js';
 
 class LayerPlacement {
   constructor() {
@@ -84,4 +83,4 @@ class PauseablePlacement {
   }
 }
 
-module.exports = PauseablePlacement;
+export default PauseablePlacement;

package/src/style/properties.js

@@ -1,9 +1,8 @@
-const assert = require('assert');
-
-const { clone } = require('../util/object');
-const { easeCubicInOut } = require('../util/util');
-const { interpolate, normalizePropertyExpression } = require('@mapwhit/style-expressions');
-const EvaluationParameters = require('./evaluation_parameters');
+import { interpolate, normalizePropertyExpression } from '@mapwhit/style-expressions';
+import assert from 'assert';
+import { clone } from '../util/object.js';
+import { easeCubicInOut } from '../util/util.js';
+import EvaluationParameters from './evaluation_parameters.js';
 
 /**
  * Implements a number of classes that define state and behavior for paint and layout properties, most
@@ -60,7 +59,7 @@ const EvaluationParameters = require('./evaluation_parameters');
  *
  *  @private
  */
-class PropertyValue {
+export class PropertyValue {
   constructor(property, value) {
     this.property = property;
     this.value = value;
@@ -97,7 +96,7 @@ class PropertyValue {
  *
  * @private
  */
-class TransitionablePropertyValue {
+export class TransitionablePropertyValue {
   constructor(property) {
     this.property = property;
     this.value = new PropertyValue(property, undefined);
@@ -132,7 +131,7 @@ class TransitionablePropertyValue {
  *
  * @private
  */
-class Transitionable {
+export class Transitionable {
   constructor(properties) {
     this._properties = properties;
     this._values = Object.create(properties.defaultTransitionablePropertyValues);
@@ -209,7 +208,7 @@ class Transitionable {
  *
  * @private
  */
-class TransitioningPropertyValue {
+export class TransitioningPropertyValue {
   constructor(property, value, prior, transition, now) {
     this.property = property;
     this.value = value;
@@ -264,7 +263,7 @@ class TransitioningPropertyValue {
  *
  * @private
  */
-class Transitioning {
+export class Transitioning {
   constructor(properties) {
     this._properties = properties;
     this._values = Object.create(properties.defaultTransitioningPropertyValues);
@@ -308,7 +307,7 @@ class Transitioning {
  *
  * @private
  */
-class Layout {
+export class Layout {
   constructor(properties) {
     this._properties = properties;
     this._values = Object.create(properties.defaultPropertyValues);
@@ -374,7 +373,7 @@ class Layout {
  *
  * @private
  */
-class PossiblyEvaluatedPropertyValue {
+export class PossiblyEvaluatedPropertyValue {
   constructor(property, value, parameters) {
     this.property = property;
     this.value = value;
@@ -402,15 +401,8 @@ class PossiblyEvaluatedPropertyValue {
  * an object type with the same keys, and values of type `R`.
  *
  * For properties that don't allow data-driven values, `R` is a scalar type such as `number`, `string`, or `Color`.
- * For data-driven properties, it is `PossiblyEvaluatedPropertyValue`. Critically, the type definitions are set up
- * in a way that allows flow to know which of these two cases applies for any given property name, and if you attempt
- * to use a `PossiblyEvaluatedPropertyValue` as if it was a scalar, or vice versa, you will get a type error. (However,
- * there's at least one case in which flow fails to produce a type error that you should be aware of: in a context such
- * as `layer._paint.get('foo-opacity') === 0`, if `foo-opacity` is data-driven, than the left-hand side is of type
- * `PossiblyEvaluatedPropertyValue<number>`, but flow will not complain about comparing this to a number using `===`.
- * See https://github.com/facebook/flow/issues/2359.)
- *
- * There's also a third, special case possiblity for `R`: for cross-faded properties, it's `?CrossFaded<T>`.
+ * For data-driven properties, it is `PossiblyEvaluatedPropertyValue`.
+ * For cross-faded properties, it's `?CrossFaded<T>`.
  *
  * @private
  */
@@ -420,7 +412,7 @@ class PossiblyEvaluatedPropertyValue {
  * given layer type.
  * @private
  */
-class PossiblyEvaluated {
+export class PossiblyEvaluated {
   constructor(properties) {
     this._properties = properties;
     this._values = Object.create(properties.defaultPossiblyEvaluatedValues);
@@ -438,7 +430,7 @@ class PossiblyEvaluated {
  *
  * @private
  */
-class DataConstantProperty {
+export class DataConstantProperty {
   constructor(specification) {
     this.specification = specification;
     this.specification['property-type'] ??= 'data-constant';
@@ -465,7 +457,7 @@ class DataConstantProperty {
  *
  * @private
  */
-class DataDrivenProperty {
+export class DataDrivenProperty {
   constructor(specification) {
     this.specification = specification;
     this.specification['property-type'] ??= 'data-driven';
@@ -525,7 +517,7 @@ class DataDrivenProperty {
  * @private
  */
 
-class CrossFadedDataDrivenProperty extends DataDrivenProperty {
+export class CrossFadedDataDrivenProperty extends DataDrivenProperty {
   constructor(specification) {
     specification['property-type'] ??= 'cross-faded-data-driven';
     super(specification);
@@ -585,7 +577,7 @@ class CrossFadedDataDrivenProperty extends DataDrivenProperty {
  *
  * @private
  */
-class CrossFadedProperty {
+export class CrossFadedProperty {
   constructor(specification) {
     this.specification = specification;
     this.specification['property-type'] ??= 'cross-faded';
@@ -626,7 +618,7 @@ class CrossFadedProperty {
  * @private
  */
 
-class ColorRampProperty {
+export class ColorRampProperty {
   constructor(specification) {
     this.specification = specification;
     this.specification['property-type'] ??= 'color-ramp';
@@ -652,7 +644,7 @@ class ColorRampProperty {
  *
  * @private
  */
-class Properties {
+export class Properties {
   constructor(properties) {
     this.properties = properties;
     this.defaultPropertyValues = {};
@@ -670,18 +662,3 @@ class Properties {
     }
   }
 }
-
-module.exports = {
-  PropertyValue,
-  Transitionable,
-  Transitioning,
-  Layout,
-  PossiblyEvaluatedPropertyValue,
-  PossiblyEvaluated,
-  DataConstantProperty,
-  DataDrivenProperty,
-  CrossFadedDataDrivenProperty,
-  CrossFadedProperty,
-  ColorRampProperty,
-  Properties
-};

package/src/style/query_utils.js

@@ -1,12 +1,6 @@
-const { default: Point } = require('@mapbox/point-geometry');
+import Point from '@mapbox/point-geometry';
 
-module.exports = {
-  getMaximumPaintValue,
-  translateDistance,
-  translate
-};
-
-function getMaximumPaintValue(property, layer, bucket) {
+export function getMaximumPaintValue(property, layer, bucket) {
   const value = layer._paint.get(property).value;
   if (value.kind === 'constant') {
     return value.value;
@@ -15,11 +9,11 @@ function getMaximumPaintValue(property, layer, bucket) {
   return binders[property].maxValue;
 }
 
-function translateDistance(translate) {
+export function translateDistance(translate) {
   return Math.sqrt(translate[0] * translate[0] + translate[1] * translate[1]);
 }
 
-function translate(queryGeometry, translate, translateAnchor, bearing, pixelsToTileUnits) {
+export function translate(queryGeometry, translate, translateAnchor, bearing, pixelsToTileUnits) {
   if (!translate[0] && !translate[1]) {
     return queryGeometry;
   }

package/src/style/style.js

@@ -1,23 +1,22 @@
-const assert = require('assert');
-
-const { Event, ErrorEvent, Evented } = require('@mapwhit/events');
-const createStyleLayer = require('./create_style_layer');
-const loadSprite = require('./load_sprite');
-const ImageManager = require('../render/image_manager');
-const GlyphManager = require('../render/glyph_manager');
-const Light = require('./light');
-const LineAtlas = require('../render/line_atlas');
-const { clone, deepEqual, filterObject, mapObject } = require('../util/object');
-const browser = require('../util/browser');
-const { getType: getSourceType, setType: setSourceType } = require('../source/source');
-const { queryRenderedFeatures, queryRenderedSymbols, querySourceFeatures } = require('../source/query_features');
-const SourceCache = require('../source/source_cache');
-const plugin = require('../source/rtl_text_plugin');
-const PauseablePlacement = require('./pauseable_placement');
-const ZoomHistory = require('./zoom_history');
-const CrossTileSymbolIndex = require('../symbol/cross_tile_symbol_index');
-const StyleLayerIndex = require('../style/style_layer_index');
-const { resources } = require('../source/resources');
+import { ErrorEvent, Event, Evented } from '@mapwhit/events';
+import assert from 'assert';
+import GlyphManager from '../render/glyph_manager.js';
+import ImageManager from '../render/image_manager.js';
+import LineAtlas from '../render/line_atlas.js';
+import { queryRenderedFeatures, queryRenderedSymbols, querySourceFeatures } from '../source/query_features.js';
+import { resources } from '../source/resources/index.js';
+import plugin from '../source/rtl_text_plugin.js';
+import { getType as getSourceType, setType as setSourceType } from '../source/source.js';
+import SourceCache from '../source/source_cache.js';
+import CrossTileSymbolIndex from '../symbol/cross_tile_symbol_index.js';
+import browser from '../util/browser.js';
+import { clone, deepEqual } from '../util/object.js';
+import createStyleLayer from './create_style_layer.js';
+import Light from './light.js';
+import loadSprite from './load_sprite.js';
+import PauseablePlacement from './pauseable_placement.js';
+import StyleLayerIndex from './style_layer_index.js';
+import ZoomHistory from './zoom_history.js';
 
 const properties = [
   'version',
@@ -246,13 +245,23 @@ class Style extends Evented {
   }
 
   loaded() {
-    if (!this._loaded) return false;
+    if (!this._loaded) {
+      return false;
+    }
 
-    if (Object.keys(this._updatedSources).length) return false;
+    if (Object.keys(this._updatedSources).length) {
+      return false;
+    }
 
-    for (const id in this._sources) if (!this._sources[id].loaded()) return false;
+    for (const id in this._sources) {
+      if (!this._sources[id].loaded()) {
+        return false;
+      }
+    }
 
-    if (!this.imageManager.isLoaded()) return false;
+    if (!this.imageManager.isLoaded()) {
+      return false;
+    }
 
     return true;
   }
@@ -428,7 +437,9 @@ class Style extends Evented {
     sourceCache.setEventedParent(null);
     sourceCache.clearTiles();
 
-    if (sourceCache.onRemove) sourceCache.onRemove(this.map);
+    if (sourceCache.onRemove) {
+      sourceCache.onRemove(this.map);
+    }
     this._changed = true;
   }
 
@@ -664,7 +675,9 @@ class Style extends Evented {
       return;
     }
 
-    if (deepEqual(layer.getLayoutProperty(name), value)) return;
+    if (deepEqual(layer.getLayoutProperty(name), value)) {
+      return;
+    }
 
     layer.setLayoutProperty(name, value);
     const layerObject = this.layers.find(({ id }) => id === layerId);
@@ -695,7 +708,9 @@ class Style extends Evented {
       return;
     }
 
-    if (deepEqual(layer.getPaintProperty(name), value)) return;
+    if (deepEqual(layer.getPaintProperty(name), value)) {
+      return;
+    }
 
     const layerObject = this.layers.find(({ id }) => id === layerId);
     layerObject.paint ??= {};
@@ -853,7 +868,9 @@ class Style extends Evented {
         // add all 3D features that are in or above the current layer
         for (let i = features3D.length - 1; i >= 0; i--) {
           const topmost3D = features3D[i].feature;
-          if (layerIndex.get(topmost3D.layer.id) < l) break;
+          if (layerIndex.get(topmost3D.layer.id) < l) {
+            break;
+          }
           features.push(topmost3D);
           features3D.pop();
         }
@@ -889,7 +906,9 @@ class Style extends Evented {
 
     const sourceResults = [];
     for (const id in this._sources) {
-      if (params.layers && !includedSources[id]) continue;
+      if (params.layers && !includedSources[id]) {
+        continue;
+      }
       sourceResults.push(
         queryRenderedFeatures(this._sources[id], this._layers, queryGeometry.viewport, params, transform)
       );
@@ -932,7 +951,9 @@ class Style extends Evented {
         break;
       }
     }
-    if (!_update) return;
+    if (!_update) {
+      return;
+    }
 
     const parameters = {
       now: browser.now(),
@@ -990,7 +1011,9 @@ class Style extends Evented {
     const layerTiles = {};
 
     for (const layer of this._layers.values()) {
-      if (layer.type !== 'symbol') continue;
+      if (layer.type !== 'symbol') {
+        continue;
+      }
 
       if (!layerTiles[layer.source]) {
         const sourceCache = this._sources[layer.source];
@@ -1055,7 +1078,9 @@ class Style extends Evented {
 
     if (placementCommitted || symbolBucketsChanged) {
       for (const layer of this._layers.values()) {
-        if (layer.type !== 'symbol') continue;
+        if (layer.type !== 'symbol') {
+          continue;
+        }
         this.placement.updateLayerOpacities(layer, layerTiles[layer.source]);
       }
     }
@@ -1084,4 +1109,4 @@ class Style extends Evented {
 Style.getSourceType = getSourceType;
 Style.setSourceType = setSourceType;
 
-module.exports = Style;
+export default Style;

package/src/style/style_layer/background_style_layer.js

@@ -1,6 +1,5 @@
-const StyleLayer = require('../style_layer');
-
-const properties = require('./background_style_layer_properties');
+import StyleLayer from '../style_layer.js';
+import properties from './background_style_layer_properties.js';
 
 class BackgroundStyleLayer extends StyleLayer {
   constructor(layer) {
@@ -8,4 +7,4 @@ class BackgroundStyleLayer extends StyleLayer {
   }
 }
 
-module.exports = BackgroundStyleLayer;
+export default BackgroundStyleLayer;

package/src/style/style_layer/background_style_layer_properties.js

@@ -1,6 +1,6 @@
 // This file is generated. Edit layer-properties.js.ejs, then run `make generate-style-code`.
 
-const { Properties, CrossFadedProperty, DataConstantProperty } = require('../properties');
+import { CrossFadedProperty, DataConstantProperty, Properties } from '../properties.js';
 
 const paint = new Properties({
   'background-color': new DataConstantProperty({
@@ -22,4 +22,4 @@ const paint = new Properties({
   })
 });
 
-module.exports = { paint };
+export default { paint };

package/src/style/style_layer/circle_style_layer.js

@@ -1,11 +1,12 @@
-const StyleLayer = require('../style_layer');
+import glMatrix from '@mapbox/gl-matrix';
+import Point from '@mapbox/point-geometry';
+import CircleBucket from '../../data/bucket/circle_bucket.js';
+import { polygonIntersectsBufferedPoint } from '../../util/intersection_tests.js';
+import { getMaximumPaintValue, translate, translateDistance } from '../query_utils.js';
+import StyleLayer from '../style_layer.js';
+import properties from './circle_style_layer_properties.js';
 
-const CircleBucket = require('../../data/bucket/circle_bucket');
-const { polygonIntersectsBufferedPoint } = require('../../util/intersection_tests');
-const { getMaximumPaintValue, translateDistance, translate } = require('../query_utils');
-const properties = require('./circle_style_layer_properties');
-const { vec4 } = require('@mapbox/gl-matrix');
-const { default: Point } = require('@mapbox/point-geometry');
+const { vec4 } = glMatrix;
 
 class CircleStyleLayer extends StyleLayer {
   constructor(layer) {
@@ -73,7 +74,9 @@ class CircleStyleLayer extends StyleLayer {
           adjustedSize *= transform.cameraToCenterDistance / projectedCenter[3];
         }
 
-        if (polygonIntersectsBufferedPoint(transformedPolygon, transformedPoint, adjustedSize)) return true;
+        if (polygonIntersectsBufferedPoint(transformedPolygon, transformedPoint, adjustedSize)) {
+          return true;
+        }
       }
     }
 
@@ -92,4 +95,4 @@ function projectQueryGeometry(queryGeometry, pixelPosMatrix) {
   });
 }
 
-module.exports = CircleStyleLayer;
+export default CircleStyleLayer;

package/src/style/style_layer/circle_style_layer_properties.js

@@ -1,6 +1,6 @@
 // This file is generated. Edit layer-properties.js.ejs, then run `make generate-style-code`.
 
-const { Properties, DataConstantProperty, DataDrivenProperty } = require('../properties');
+import { DataConstantProperty, DataDrivenProperty, Properties } from '../properties.js';
 
 const paint = new Properties({
   'circle-radius': new DataDrivenProperty({
@@ -73,4 +73,4 @@ const paint = new Properties({
   })
 });
 
-module.exports = { paint };
+export default { paint };

package/src/style/style_layer/fill_extrusion_style_layer.js

@@ -1,13 +1,14 @@
-const StyleLayer = require('../style_layer');
+import glMatrix from '@mapbox/gl-matrix';
+import Point from '@mapbox/point-geometry';
+import FillExtrusionBucket from '../../data/bucket/fill_extrusion_bucket.js';
+import { polygonIntersectsMultiPolygon, polygonIntersectsPolygon } from '../../util/intersection_tests.js';
+import { translate, translateDistance } from '../query_utils.js';
+import StyleLayer from '../style_layer.js';
+import properties from './fill_extrusion_style_layer_properties.js';
 
-const FillExtrusionBucket = require('../../data/bucket/fill_extrusion_bucket');
-const { polygonIntersectsPolygon, polygonIntersectsMultiPolygon } = require('../../util/intersection_tests');
-const { translateDistance, translate } = require('../query_utils');
-const properties = require('./fill_extrusion_style_layer_properties');
-const { vec4 } = require('@mapbox/gl-matrix');
-const { default: Point } = require('@mapbox/point-geometry');
+const { vec4 } = glMatrix;
 
-class FillExtrusionStyleLayer extends StyleLayer {
+export class FillExtrusionStyleLayer extends StyleLayer {
   constructor(layer) {
     super(layer, properties);
   }
@@ -57,7 +58,7 @@ function dot(a, b) {
   return a.x * b.x + a.y * b.y;
 }
 
-function getIntersectionDistance(projectedQueryGeometry, projectedFace) {
+export function getIntersectionDistance(projectedQueryGeometry, projectedFace) {
   if (projectedQueryGeometry.length === 1) {
     // For point queries calculate the z at which the point intersects the face
     // using barycentric coordinates.
@@ -73,7 +74,9 @@ function getIntersectionDistance(projectedQueryGeometry, projectedFace) {
     let b;
     while (!b || a.equals(b)) {
       b = projectedFace[i++];
-      if (!b) return Number.POSITIVE_INFINITY;
+      if (!b) {
+        return Number.POSITIVE_INFINITY;
+      }
     }
 
     // Loop until point `c` is not colinear with points `a` and `b`.
@@ -99,7 +102,9 @@ function getIntersectionDistance(projectedQueryGeometry, projectedFace) {
       // Use the barycentric weighting along with the original triangle z coordinates to get the point of intersection.
       const distance = a.z * u + b.z * v + c.z * w;
 
-      if (Number.isFinite(distance)) return distance;
+      if (Number.isFinite(distance)) {
+        return distance;
+      }
     }
     return Number.POSITIVE_INFINITY;
   }
@@ -205,5 +210,3 @@ function projectQueryGeometry(queryGeometry, pixelPosMatrix, transform, z) {
   }
   return projectedQueryGeometry;
 }
-
-module.exports = { FillExtrusionStyleLayer, getIntersectionDistance };

package/src/style/style_layer/fill_extrusion_style_layer_properties.js

@@ -1,6 +1,6 @@
 // This file is generated. Edit layer-properties.js.ejs, then run `make generate-style-code`.
 
-const { Properties, CrossFadedDataDrivenProperty, DataConstantProperty, DataDrivenProperty } = require('../properties');
+import { CrossFadedDataDrivenProperty, DataConstantProperty, DataDrivenProperty, Properties } from '../properties.js';
 
 const paint = new Properties({
   'fill-extrusion-opacity': new DataConstantProperty({
@@ -53,4 +53,4 @@ const paint = new Properties({
   })
 });
 
-module.exports = { paint };
+export default { paint };

package/src/style/style_layer/fill_style_layer.js

@@ -1,9 +1,8 @@
-const StyleLayer = require('../style_layer');
-
-const FillBucket = require('../../data/bucket/fill_bucket');
-const { polygonIntersectsMultiPolygon } = require('../../util/intersection_tests');
-const { translateDistance, translate } = require('../query_utils');
-const properties = require('./fill_style_layer_properties');
+import FillBucket from '../../data/bucket/fill_bucket.js';
+import { polygonIntersectsMultiPolygon } from '../../util/intersection_tests.js';
+import { translate, translateDistance } from '../query_utils.js';
+import StyleLayer from '../style_layer.js';
+import properties from './fill_style_layer_properties.js';
 
 class FillStyleLayer extends StyleLayer {
   constructor(layer) {
@@ -43,4 +42,4 @@ class FillStyleLayer extends StyleLayer {
   }
 }
 
-module.exports = FillStyleLayer;
+export default FillStyleLayer;

package/src/style/style_layer/fill_style_layer_properties.js

@@ -1,6 +1,6 @@
 // This file is generated. Edit layer-properties.js.ejs, then run `make generate-style-code`.
 
-const { Properties, CrossFadedDataDrivenProperty, DataConstantProperty, DataDrivenProperty } = require('../properties');
+import { CrossFadedDataDrivenProperty, DataConstantProperty, DataDrivenProperty, Properties } from '../properties.js';
 
 const paint = new Properties({
   'fill-antialias': new DataConstantProperty({ type: 'boolean', default: true, expression: { parameters: ['zoom'] } }),
@@ -42,4 +42,4 @@ const paint = new Properties({
   })
 });
 
-module.exports = { paint };
+export default { paint };

package/src/style/style_layer/heatmap_style_layer.js

@@ -1,8 +1,7 @@
-const StyleLayer = require('../style_layer');
-
-const HeatmapBucket = require('../../data/bucket/heatmap_bucket');
-const properties = require('./heatmap_style_layer_properties');
-const renderColorRamp = require('../../util/color_ramp');
+import HeatmapBucket from '../../data/bucket/heatmap_bucket.js';
+import renderColorRamp from '../../util/color_ramp.js';
+import StyleLayer from '../style_layer.js';
+import properties from './heatmap_style_layer_properties.js';
 
 class HeatmapStyleLayer extends StyleLayer {
   createBucket(options) {
@@ -48,4 +47,4 @@ class HeatmapStyleLayer extends StyleLayer {
   }
 }
 
-module.exports = HeatmapStyleLayer;
+export default HeatmapStyleLayer;

package/src/style/style_layer/heatmap_style_layer_properties.js

@@ -1,6 +1,6 @@
 // This file is generated. Edit layer-properties.js.ejs, then run `make generate-style-code`.
 
-const { Properties, ColorRampProperty, DataConstantProperty, DataDrivenProperty } = require('../properties');
+import { ColorRampProperty, DataConstantProperty, DataDrivenProperty, Properties } from '../properties.js';
 
 const paint = new Properties({
   'heatmap-radius': new DataDrivenProperty({
@@ -49,4 +49,4 @@ const paint = new Properties({
   })
 });
 
-module.exports = { paint };
+export default { paint };

package/src/style/style_layer/hillshade_style_layer.js

@@ -1,6 +1,5 @@
-const StyleLayer = require('../style_layer');
-
-const properties = require('./hillshade_style_layer_properties');
+import StyleLayer from '../style_layer.js';
+import properties from './hillshade_style_layer_properties.js';
 
 class HillshadeStyleLayer extends StyleLayer {
   constructor(layer) {
@@ -12,4 +11,4 @@ class HillshadeStyleLayer extends StyleLayer {
   }
 }
 
-module.exports = HillshadeStyleLayer;
+export default HillshadeStyleLayer;

package/src/style/style_layer/hillshade_style_layer_properties.js

@@ -1,6 +1,6 @@
 // This file is generated. Edit layer-properties.js.ejs, then run `make generate-style-code`.
 
-const { Properties, DataConstantProperty } = require('../properties');
+import { DataConstantProperty, Properties } from '../properties.js';
 
 const paint = new Properties({
   'hillshade-illumination-direction': new DataConstantProperty({
@@ -40,4 +40,4 @@ const paint = new Properties({
   })
 });
 
-module.exports = { paint };
+export default { paint };