@loaders.gl/mvt 4.3.0-alpha.1 → 4.3.0-alpha.2

package/dist/{geojson-tile-source.js → table-tile-source.js}

@@ -2,16 +2,37 @@
 // SPDX-License-Identifier: MIT AND ISC
 // Copyright (c) vis.gl contributors
 // Based on https://github.com/mapbox/geojson-vt under compatible ISC license
-import { convert } from "./lib/geojsonvt/convert.js"; // GeoJSON conversion and preprocessing
-import { clip } from "./lib/geojsonvt/clip.js"; // stripe clipping algorithm
-import { wrap } from "./lib/geojsonvt/wrap.js"; // date line processing
-import { transformTile } from "./lib/geojsonvt/transform.js"; // coordinate transformation
-import { createTile } from "./lib/geojsonvt/tile.js"; // final simplified tile generation
-export class GeoJSONTileSource {
-    static defaultOptions = {
+import { log } from '@loaders.gl/loader-utils';
+import { deduceTableSchema } from '@loaders.gl/schema';
+import { Stats, Stat } from '@probe.gl/stats';
+import { convert } from "./lib/vector-tiler/convert.js"; // GeoJSON conversion and preprocessing
+import { clip } from "./lib/vector-tiler/clip.js"; // stripe clipping algorithm
+import { wrap } from "./lib/vector-tiler/wrap.js"; // date line processing
+import { transformTile } from "./lib/vector-tiler/transform.js"; // coordinate transformation
+import { createTile } from "./lib/vector-tiler/tile.js"; // final simplified tile generation
+import { projectToLngLat } from "./lib/utils/geometry-utils.js";
+import { convertToLocalCoordinates } from "./lib/utils/geometry-utils.js";
+/**
+ * Dynamically vector tiles a table (the table needs a geometry column)
+ * - Tiles are generated when requested.
+ * - Each tile contains a tables of clipped features.
+ *
+ * @note - Currently only accepts `GeoJSONTable` tables
+ * @note - Currently only outputs `GeoJSONTable`
+ * @note - (can be initialized with a promise that resolves to GeoJSONTable).
+ *
+ * @todo - metadata should scan all rows to determine schema
+ * @todo - metadata scan all rows to determine tilestats (field values[] etc).
+ * @todo - handle binary input tables
+ * @todo - generate binary output tables
+ * @todo - how does TileSourceLayer specify coordinates / decided which layer to render with
+ */
+export class TableTileSource {
+    static defaultProps = {
+        coordinates: 'wgs84', // coordinates in tile coordinates or lng/lat
         maxZoom: 14, // max zoom to preserve detail on
         indexMaxZoom: 5, // max zoom in the tile index
-        indexMaxPoints: 100000, // max number of points per tile in the tile index
+        maxPointsPerTile: 100000, // max number of points per tile in the tile index
         tolerance: 3, // simplification tolerance (higher means simpler)
         extent: 4096, // tile extent
         buffer: 64, // tile buffer on each side
@@ -21,58 +42,49 @@ export class GeoJSONTileSource {
         generateId: false, // whether to generate feature ids. Cannot be used with promoteId
         debug: 0 // logging level (0, 1 or 2)
     };
+    /** Global stats for all TableTileSources */
+    static stats = new Stats({
+        id: 'table-tile-source-all',
+        stats: [new Stat('count', 'tiles'), new Stat('count', 'features')]
+    });
+    /** Stats for this TableTileSource */
+    stats = new Stats({
+        id: 'table-tile-source',
+        stats: [new Stat('tiles', 'count'), new Stat('features', 'count')]
+    });
+    /** MIME type of the tiles emitted by this tile source */
     mimeType = 'application/vnd.mapbox-vector-tile';
-    options;
-    // tiles and tileCoords are part of the public API
+    localCoordinates = true;
+    /** The props that this tile source was created with */
+    props;
+    /* Schema of the data */
+    schema = null;
+    /** Map of generated tiles, indexed by stringified tile coordinates */
     tiles = {};
+    /** Array of tile coordinates */
     tileCoords = [];
-    stats = {};
-    total = 0;
-    /** Sync methods can be called: the input data promise has been resolved and initial top-level tiling is done */
+    /** Input data has loaded, initial top-level tiling is done, sync methods can now be called */
     ready;
-    constructor(data, options) {
-        this.options = { ...GeoJSONTileSource.defaultOptions, ...options };
+    /** Metadata for the tile source (generated TileJSON/tilestats */
+    metadata;
+    constructor(table, props) {
+        this.props = { ...TableTileSource.defaultProps, ...props };
         this.getTileData = this.getTileData.bind(this);
-        this.ready = this.initializeTilesAsync(data);
+        this.ready = this.initializeTilesAsync(table);
+        this.metadata = this.getMetadata();
     }
-    async initializeTilesAsync(dataPromise) {
-        const data = await dataPromise;
-        this.initializeTilesSync(data);
-    }
-    initializeTilesSync(data) {
-        const options = this.options;
-        const debug = options.debug;
-        if (debug)
-            console.time('preprocess data');
-        if (this.options.maxZoom < 0 || this.options.maxZoom > 24) {
-            throw new Error('maxZoom should be in the 0-24 range');
-        }
-        if (options.promoteId && this.options.generateId) {
-            throw new Error('promoteId and generateId cannot be used together.');
-        }
-        // projects and adds simplification info
-        let features = convert(data, options);
-        if (debug) {
-            console.timeEnd('preprocess data');
-            console.log('index: maxZoom: %d, maxPoints: %d', options.indexMaxZoom, options.indexMaxPoints);
-            console.time('generate tiles');
-        }
-        // wraps features (ie extreme west and extreme east)
-        features = wrap(features, this.options);
-        // start slicing from the top tile down
-        if (features.length) {
-            this.splitTile(features, 0, 0, 0);
-        }
-        if (debug) {
-            if (features.length) {
-                console.log('features: %d, points: %d', this.tiles[0].numFeatures, this.tiles[0].numPoints);
-            }
-            console.timeEnd('generate tiles');
-            console.log('tiles generated:', this.total, JSON.stringify(this.stats));
-        }
+    async initializeTilesAsync(tablePromise) {
+        const table = await tablePromise;
+        this.schema = deduceTableSchema(table);
+        this.createRootTiles(table);
     }
     async getMetadata() {
-        return {};
+        await this.ready;
+        return { schema: this.schema, minZoom: 0, maxZoom: this.props.maxZoom };
+    }
+    async getSchema() {
+        await this.ready;
+        return this.schema;
     }
     /**
      * Get a tile at the specified index
@@ -82,6 +94,7 @@ export class GeoJSONTileSource {
     async getVectorTile(tileIndex) {
         await this.ready;
         const table = this.getTileSync(tileIndex);
+        log.info(2, 'getVectorTile', tileIndex, table)();
         return table;
     }
     async getTile(tileIndex) {
@@ -90,7 +103,8 @@ export class GeoJSONTileSource {
     }
     async getTileData(tileParams) {
         const { x, y, z } = tileParams.index;
-        return await this.getVectorTile({ x, y, z });
+        const tile = await this.getVectorTile({ x, y, z });
+        return tile?.features || [];
     }
     // Implementation
     /**
@@ -102,7 +116,41 @@ export class GeoJSONTileSource {
         if (!rawTile) {
             return null;
         }
-        return convertToGeoJSONTable(rawTile, this.options.extent);
+        return convertToGeoJSONTable(rawTile, {
+            coordinates: this.props.coordinates,
+            tileIndex,
+            extent: this.props.extent
+        });
+    }
+    /**
+     * Create the initial tiles
+     * @note the tiles stores all the features together with additional data
+     */
+    createRootTiles(table) {
+        if (this.props.maxZoom < 0 || this.props.maxZoom > 24) {
+            throw new Error('maxZoom should be in the 0-24 range');
+        }
+        if (this.props.promoteId && this.props.generateId) {
+            throw new Error('promoteId and generateId cannot be used together.');
+        }
+        log.log(1, 'TableTileSource creating root tiles', this.props)();
+        // projects and adds simplification info
+        log.time(1, 'preprocess table')();
+        let features = convert(table, this.props);
+        log.timeEnd(1, 'preprocess table')();
+        // wraps features (ie extreme west and extreme east)
+        log.time(1, 'generate tiles')();
+        features = wrap(features, this.props);
+        // start slicing from the top tile down
+        if (features.length === 0) {
+            log.log(1, 'TableTileSource: no features generated')();
+            return;
+        }
+        this.splitTile(features, 0, 0, 0);
+        const rootTile = this.tiles[0];
+        log.log(1, `root tile features: ${rootTile.numFeatures}, points: ${rootTile.numPoints}`)();
+        log.timeEnd(1, 'generate tiles')();
+        log.log(1, `TableTileSource: tiles generated: ${this.stats.get('total').count}`, this.stats)();
     }
     /**
      * Return geojsonvt-style "half formed" vector tile
@@ -115,7 +163,7 @@ export class GeoJSONTileSource {
         // z = +z;
         // x = +x;
         // y = +y;
-        const { extent, debug } = this.options;
+        const { extent } = this.props;
         if (z < 0 || z > 24) {
             return null;
         }
@@ -125,8 +173,7 @@ export class GeoJSONTileSource {
         if (this.tiles[id]) {
             return transformTile(this.tiles[id], extent);
         }
-        if (debug > 1)
-            console.log('drilling down to z%d-%d-%d', z, x, y);
+        log.log(log, 'drilling down to z%d-%d-%d', z, x, y)();
         let z0 = z;
         let x0 = x;
         let y0 = y;
@@ -141,14 +188,10 @@ export class GeoJSONTileSource {
             return null;
         }
         // if we found a parent tile containing the original geometry, we can drill down from it
-        if (debug > 1) {
-            console.log('found parent tile z%d-%d-%d', z0, x0, y0);
-            console.time('drilling down');
-        }
+        log.log(1, 'found parent tile z%d-%d-%d', z0, x0, y0)();
+        log.time(1, 'drilling down')();
         this.splitTile(parent.source, z0, x0, y0, z, x, y);
-        if (debug > 1) {
-            console.timeEnd('drilling down');
-        }
+        log.timeEnd(1, 'drilling down')();
         return this.tiles[id] ? transformTile(this.tiles[id], extent) : null;
     }
     /**
@@ -157,13 +200,11 @@ export class GeoJSONTileSource {
      * @param cz, cx, and cy are the coordinates of the target tile
      *
      * If no target tile is specified, splitting stops when we reach the maximum
-     * zoom or the number of points is low as specified in the options.
+     * zoom or the number of points is low as specified in the props.
      */
     // eslint-disable-next-line max-params, max-statements, complexity
     splitTile(features, z, x, y, cz, cx, cy) {
         const stack = [features, z, x, y];
-        const options = this.options;
-        const debug = options.debug;
         // avoid recursion by using a processing queue
         while (stack.length) {
             y = stack.pop();
@@ -174,31 +215,33 @@ export class GeoJSONTileSource {
             const id = toID(z, x, y);
             let tile = this.tiles[id];
             if (!tile) {
-                if (debug > 1) {
-                    console.time('creation');
-                }
-                tile = this.tiles[id] = createTile(features, z, x, y, options);
+                log.time(2, 'tile creation')();
+                tile = this.tiles[id] = createTile(features, z, x, y, this.props);
                 this.tileCoords.push({ z, x, y });
-                if (debug) {
-                    if (debug > 1) {
-                        console.log('tile z%d-%d-%d (features: %d, points: %d, simplified: %d)', z, x, y, tile.numFeatures, tile.numPoints, tile.numSimplified);
-                        console.timeEnd('creation');
-                    }
-                    const key = `z${z}`;
-                    this.stats[key] = (this.stats[key] || 0) + 1;
-                    this.total++;
-                }
+                const key = `z${z}`;
+                let stat = this.stats.get(key, 'count');
+                stat.incrementCount();
+                stat = this.stats.get('total');
+                stat.incrementCount();
+                stat = TableTileSource.stats.get(key, 'count');
+                stat.incrementCount();
+                stat = TableTileSource.stats.get('total');
+                stat.incrementCount();
+                log.log(2, 'tile z%d-%d-%d (features: %d, points: %d, simplified: %d)', z, x, y, tile.numFeatures, tile.numPoints, tile.numSimplified)();
+                log.timeEnd(2, 'tile creation')();
             }
             // save reference to original geometry in tile so that we can drill down later if we stop now
             tile.source = features;
+            /** eslint-disable no-continue */
             // if it's the first-pass tiling
             if (cz === undefined) {
                 // stop tiling if we reached max zoom, or if the tile is too simple
-                if (z === options.indexMaxZoom || tile.numPoints <= options.indexMaxPoints)
+                if (z === this.props.indexMaxZoom || tile.numPoints <= this.props.maxPointsPerTile) {
                     continue;
+                }
                 // if a drilldown to a specific tile
             }
-            else if (z === options.maxZoom || z === cz) {
+            else if (z === this.props.maxZoom || z === cz) {
                 // stop tiling if we reached base zoom or our target tile zoom
                 continue;
             }
@@ -206,17 +249,17 @@ export class GeoJSONTileSource {
                 // stop tiling if it's not an ancestor of the target tile
                 const zoomSteps = cz - z;
                 // @ts-expect-error TODO fix the types of cx cy
-                if (x !== cx >> zoomSteps || y !== cy >> zoomSteps)
+                if (x !== cx >> zoomSteps || y !== cy >> zoomSteps) {
                     continue;
+                }
             }
             // if we slice further down, no need to keep source geometry
             tile.source = null;
             if (features.length === 0)
                 continue;
-            if (debug > 1)
-                console.time('clipping');
+            log.time(2, 'clipping tile')();
             // values we'll use for clipping
-            const k1 = (0.5 * options.buffer) / options.extent;
+            const k1 = (0.5 * this.props.buffer) / this.props.extent;
             const k2 = 0.5 - k1;
             const k3 = 0.5 + k1;
             const k4 = 1 + k1;
@@ -224,22 +267,21 @@ export class GeoJSONTileSource {
             let bl = null;
             let tr = null;
             let br = null;
-            let left = clip(features, z2, x - k1, x + k3, 0, tile.minX, tile.maxX, options);
-            let right = clip(features, z2, x + k2, x + k4, 0, tile.minX, tile.maxX, options);
+            let left = clip(features, z2, x - k1, x + k3, 0, tile.minX, tile.maxX, this.props);
+            let right = clip(features, z2, x + k2, x + k4, 0, tile.minX, tile.maxX, this.props);
             // @ts-expect-error - unclear why this is needed?
             features = null;
             if (left) {
-                tl = clip(left, z2, y - k1, y + k3, 1, tile.minY, tile.maxY, options);
-                bl = clip(left, z2, y + k2, y + k4, 1, tile.minY, tile.maxY, options);
+                tl = clip(left, z2, y - k1, y + k3, 1, tile.minY, tile.maxY, this.props);
+                bl = clip(left, z2, y + k2, y + k4, 1, tile.minY, tile.maxY, this.props);
                 left = null;
             }
             if (right) {
-                tr = clip(right, z2, y - k1, y + k3, 1, tile.minY, tile.maxY, options);
-                br = clip(right, z2, y + k2, y + k4, 1, tile.minY, tile.maxY, options);
+                tr = clip(right, z2, y - k1, y + k3, 1, tile.minY, tile.maxY, this.props);
+                br = clip(right, z2, y + k2, y + k4, 1, tile.minY, tile.maxY, this.props);
                 right = null;
             }
-            if (debug > 1)
-                console.timeEnd('clipping');
+            log.timeEnd(2, 'clipping tile')();
             stack.push(tl || [], z + 1, x * 2, y * 2);
             stack.push(bl || [], z + 1, x * 2, y * 2 + 1);
             stack.push(tr || [], z + 1, x * 2 + 1, y * 2);
@@ -250,7 +292,8 @@ export class GeoJSONTileSource {
 function toID(z, x, y) {
     return ((1 << z) * y + x) * 32 + z;
 }
-function convertToGeoJSONTable(vtTile, extent) {
+// eslint-disable-next-line max-statements, complexity
+function convertToGeoJSONTable(vtTile, props) {
     const features = [];
     for (const rawFeature of vtTile.features) {
         if (!rawFeature || !rawFeature.geometry) {
@@ -293,17 +336,31 @@ function convertToGeoJSONTable(vtTile, extent) {
             default:
                 continue;
         }
-        coordinates = toLngLat(coordinates, extent);
+        switch (props.coordinates) {
+            case 'EPSG:4326':
+            case 'wgs84':
+                projectToLngLat(coordinates, props.tileIndex, props.extent);
+                break;
+            case 'local':
+                convertToLocalCoordinates(coordinates, props.extent);
+                break;
+            default:
+                throw new Error(`Unsupported CRS ${props.coordinates}`);
+        }
         const feature = {
             type: 'Feature',
             geometry: {
                 type,
                 coordinates
             },
-            properties: rawFeature.tags || {}
+            properties: rawFeature.tags || {},
+            id: rawFeature.id
         };
         features.push(feature);
     }
+    if (features.length === 0) {
+        return null;
+    }
     const table = {
         shape: 'geojson-table',
         type: 'FeatureCollection',
@@ -311,9 +368,3 @@ function convertToGeoJSONTable(vtTile, extent) {
     };
     return table;
 }
-function toLngLat(coords, extent) {
-    if (Array.isArray(coords[0])) {
-        return coords.map((c) => toLngLat(c, extent));
-    }
-    return [coords[0] / extent, coords[1] / extent];
-}

package/dist/tilejson-loader.js

@@ -4,7 +4,7 @@
 import { parseTileJSON } from "./lib/parse-tilejson.js";
 // __VERSION__ is injected by babel-plugin-version-inline
 // @ts-ignore TS2304: Cannot find name '__VERSION__'.
-const VERSION = typeof "4.2.0" !== 'undefined' ? "4.2.0" : 'latest';
+const VERSION = typeof "4.3.0-alpha.1" !== 'undefined' ? "4.3.0-alpha.1" : 'latest';
 /**
  * Loader for TileJSON metadata
  */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@loaders.gl/mvt",
   "description": "Loader for Mapbox Vector Tiles",
-  "version": "4.3.0-alpha.1",
+  "version": "4.3.0-alpha.2",
   "license": "MIT",
   "type": "module",
   "publishConfig": {
@@ -41,11 +41,12 @@
     "build-worker": "esbuild src/workers/mvt-worker.ts --bundle --outfile=dist/mvt-worker.js --define:__VERSION__=\\\"$npm_package_version\\\""
   },
   "dependencies": {
-    "@loaders.gl/gis": "4.3.0-alpha.1",
-    "@loaders.gl/images": "4.3.0-alpha.1",
-    "@loaders.gl/loader-utils": "4.3.0-alpha.1",
-    "@loaders.gl/schema": "4.3.0-alpha.1",
+    "@loaders.gl/gis": "4.3.0-alpha.2",
+    "@loaders.gl/images": "4.3.0-alpha.2",
+    "@loaders.gl/loader-utils": "4.3.0-alpha.2",
+    "@loaders.gl/schema": "4.3.0-alpha.2",
     "@math.gl/polygon": "^4.0.0",
+    "@probe.gl/stats": "^4.0.0",
     "pbf": "^3.2.1"
   },
   "devDependencies": {
@@ -54,5 +55,5 @@
   "peerDependencies": {
     "@loaders.gl/core": "^4.0.0"
   },
-  "gitHead": "568446ea69eb590f0c42d965459b636216cda74e"
+  "gitHead": "77a3cb538ab7a1fbf74245f25590210451689f5c"
 }

package/src/index.ts

@@ -11,7 +11,7 @@ export {TileJSONLoader} from './tilejson-loader';
 
 export {MVTSource} from './mvt-source';
 
-// GeoJSONTileSource
+// TableTileSource
 
-export type {GeoJSONTileSourceOptions} from './geojson-tile-source';
-export {GeoJSONTileSource} from './geojson-tile-source';
+export type {TableTileSourceProps} from './table-tile-source';
+export {TableTileSource} from './table-tile-source';

package/src/lib/parse-mvt.ts

@@ -155,9 +155,9 @@ function getDecodedFeature(
   options: MVTOptions,
   layerName: string
 ): Feature {
-  const decodedFeature = feature.toGeoJSON(
-    // @ts-expect-error What is going on here?
-    options.coordinates === 'wgs84' ? options.tileIndex : transformToLocalCoordinates
+  const decodedFeature = feature.toGeoJSONFeature(
+    options.coordinates || 'local',
+    options.tileIndex
   );
 
   // Add layer name to GeoJSON properties
@@ -179,10 +179,7 @@ function getDecodedFeatureBinary(
   options: MVTOptions,
   layerName: string
 ): FlatFeature {
-  const decodedFeature = feature.toBinaryCoordinates(
-    // @ts-expect-error
-    options.coordinates === 'wgs84' ? options.tileIndex : transformToLocalCoordinatesBinary
-  );
+  const decodedFeature = feature.toBinaryFeature(options.coordinates || 'local', options.tileIndex);
 
   // Add layer name to GeoJSON properties
   if (options.layerProperty && decodedFeature.properties) {
@@ -191,29 +188,3 @@ function getDecodedFeatureBinary(
 
   return decodedFeature;
 }
-
-/**
- * @param line
- * @param feature
- */
-function transformToLocalCoordinates(line: number[], feature: {extent: any}): void {
-  // This function transforms local coordinates in a
-  // [0 - bufferSize, this.extent + bufferSize] range to a
-  // [0 - (bufferSize / this.extent), 1 + (bufferSize / this.extent)] range.
-  // The resulting extent would be 1.
-  const {extent} = feature;
-  for (let i = 0; i < line.length; i++) {
-    const p = line[i];
-    p[0] /= extent;
-    p[1] /= extent;
-  }
-}
-
-function transformToLocalCoordinatesBinary(data: number[], feature: {extent: any}) {
-  // For the binary code path, the feature data is just
-  // one big flat array, so we just divide each value
-  const {extent} = feature;
-  for (let i = 0, il = data.length; i < il; ++i) {
-    data[i] /= extent;
-  }
-}

package/src/lib/parse-tilejson.ts

@@ -16,11 +16,6 @@ export type TileJSON = {
   tileFormat?: string;
   tilesetType?: string;
 
-  /** Generating application. Tippecanoe adds this. */
-  generator?: string;
-  /** Generating application options. Tippecanoe adds this. */
-  generatorOptions?: string;
-
   /** Tile indexing scheme */
   scheme?: 'xyz' | 'tms';
   /** Sharded URLs */
@@ -38,6 +33,11 @@ export type TileJSON = {
   // Combination of tilestats (if present) and tilejson layer information
   layers?: TileJSONLayer[];
 
+  /** Generating application. Tippecanoe adds this. */
+  generator?: string;
+  /** Generating application options. Tippecanoe adds this. */
+  generatorOptions?: string;
+
   /** Any nested JSON metadata */
   metaJson?: any | null;
 };

package/src/lib/utils/geometry-utils.ts

@@ -20,16 +20,80 @@ export function signedArea(ring: number[][]) {
   return sum;
 }
 
+/**
+ * This function projects local coordinates in a
+ * [0 - bufferSize, this.extent + bufferSize] range to a
+ * [0 - (bufferSize / this.extent), 1 + (bufferSize / this.extent)] range.
+ * The resulting extent would be 1.
+ * @param line
+ * @param feature
+ */
+export function convertToLocalCoordinates(
+  coordinates: number[] | number[][] | number[][][] | number[][][][],
+  extent: number
+): void {
+  if (Array.isArray(coordinates[0])) {
+    for (const subcoords of coordinates) {
+      convertToLocalCoordinates(subcoords as number[] | number[][] | number[][][], extent);
+    }
+    return;
+  }
+
+  // Just a point
+  const p = coordinates as number[];
+  p[0] /= extent;
+  p[1] /= extent;
+}
+
+/**
+ * For the binary code path, the feature data is just
+ * one big flat array, so we just divide each value
+ * @param data
+ * @param feature
+ */
+export function convertToLocalCoordinatesFlat(data: number[], extent: number): void {
+  for (let i = 0, il = data.length; i < il; ++i) {
+    data[i] /= extent;
+  }
+}
+
 /**
  * Projects local tile coordinates to lngLat in place.
  * @param points
  * @param tileIndex
  */
+export function projectToLngLat(
+  line: number[] | number[][] | number[][][],
+  tileIndex: {x: number; y: number; z: number},
+  extent: number
+): void {
+  if (typeof line[0][0] !== 'number') {
+    for (const point of line) {
+      // @ts-expect-error
+      projectToLngLat(point, tileIndex, extent);
+    }
+    return;
+  }
+  const size = extent * Math.pow(2, tileIndex.z);
+  const x0 = extent * tileIndex.x;
+  const y0 = extent * tileIndex.y;
+  for (let j = 0; j < line.length; j++) {
+    const p = line[j];
+    p[0] = ((p[0] + x0) * 360) / size - 180;
+    const y2 = 180 - ((p[1] + y0) * 360) / size;
+    p[1] = (360 / Math.PI) * Math.atan(Math.exp((y2 * Math.PI) / 180)) - 90;
+  }
+}
+
+/**
+ * Projects local tile coordinates to lngLat in place.
+ * @param points
+ * @param tileIndex
 export function projectTileCoordinatesToLngLat(
   points: number[][],
   tileIndex: {x: number; y: number; z: number},
   extent: number
-) {
+): void {
   const {x, y, z} = tileIndex;
   const size = extent * Math.pow(2, z);
   const x0 = extent * x;
@@ -41,6 +105,7 @@ export function projectTileCoordinatesToLngLat(
     p[1] = (360 / Math.PI) * Math.atan(Math.exp((y2 * Math.PI) / 180)) - 90;
   }
 }
+ */
 
 /**
  *