@loaders.gl/mvt 4.0.0-alpha.1 → 4.0.0-alpha.11

package/src/lib/geojson-tiler/tile.ts

@@ -0,0 +1,185 @@
+// loaders.gl, MIT license
+// Forked from https://github.com/mapbox/geojson-vt under compatible ISC license
+
+// import type {Feature} from '@loaders.gl/schema';
+
+export type GeoJSONTileFeature = {
+  type: any;
+  geometry: any;
+
+  // book keeping
+  id?: string;
+  tags?: string[];
+
+  // spatial extents
+  minX: number;
+  maxX: number;
+  minY: number;
+  maxY: number;
+};
+
+export type GeoJSONTile = {
+  features: GeoJSONTileFeature[]; // Feature[]; Doesn't seem JSON compatible??
+  type?: number;
+  tags?: Record<string, string>;
+
+  // tile coordinates
+  x: number;
+  y: number;
+  z: number;
+
+  // spatial extents
+  minX: number;
+  maxX: number;
+  minY: number;
+  maxY: number;
+
+  transformed: boolean;
+  numPoints: number;
+  numSimplified: number;
+  numFeatures: number;
+  source: any | null;
+};
+
+export type CreateTileOptions = {
+  maxZoom?: number;
+  tolerance: number;
+  extent: number;
+  lineMetrics: boolean;
+};
+
+/**
+ * Create a tile from features and tile index
+ */
+export function createTile(features: any[], z, tx, ty, options: CreateTileOptions): GeoJSONTile {
+  const tolerance = z === options.maxZoom ? 0 : options.tolerance / ((1 << z) * options.extent);
+  const tile: GeoJSONTile = {
+    features: [],
+    numPoints: 0,
+    numSimplified: 0,
+    numFeatures: features.length,
+    source: null,
+    x: tx,
+    y: ty,
+    z,
+    transformed: false,
+    minX: 2,
+    minY: 1,
+    maxX: -1,
+    maxY: 0
+  };
+  for (const feature of features) {
+    addFeature(tile, feature, tolerance, options);
+  }
+  return tile;
+}
+
+// eslint-disable-next-line complexity, max-statements
+function addFeature(tile: GeoJSONTile, feature, tolerance: number, options: CreateTileOptions) {
+  const geom = feature.geometry;
+  const type = feature.type;
+  const simplified: number[] = [];
+
+  tile.minX = Math.min(tile.minX, feature.minX);
+  tile.minY = Math.min(tile.minY, feature.minY);
+  tile.maxX = Math.max(tile.maxX, feature.maxX);
+  tile.maxY = Math.max(tile.maxY, feature.maxY);
+
+  if (type === 'Point' || type === 'MultiPoint') {
+    for (let i = 0; i < geom.length; i += 3) {
+      simplified.push(geom[i], geom[i + 1]);
+      tile.numPoints++;
+      tile.numSimplified++;
+    }
+  } else if (type === 'LineString') {
+    addLine(simplified, geom, tile, tolerance, false, false);
+  } else if (type === 'MultiLineString' || type === 'Polygon') {
+    for (let i = 0; i < geom.length; i++) {
+      addLine(simplified, geom[i], tile, tolerance, type === 'Polygon', i === 0);
+    }
+  } else if (type === 'MultiPolygon') {
+    for (let k = 0; k < geom.length; k++) {
+      const polygon = geom[k];
+      for (let i = 0; i < polygon.length; i++) {
+        addLine(simplified, polygon[i], tile, tolerance, true, i === 0);
+      }
+    }
+  }
+
+  if (simplified.length) {
+    let tags = feature.tags || null;
+
+    if (type === 'LineString' && options.lineMetrics) {
+      tags = {};
+      for (const key in feature.tags) tags[key] = feature.tags[key];
+      // eslint-disable-next-line camelcase
+      tags.mapbox_clip_start = geom.start / geom.size;
+      // eslint-disable-next-line camelcase
+      tags.mapbox_clip_end = geom.end / geom.size;
+    }
+
+    // @ts-expect-error TODO - create sub type?
+    const tileFeature: GeoJSONTileFeature = {
+      geometry: simplified,
+      type:
+        type === 'Polygon' || type === 'MultiPolygon'
+          ? 3
+          : type === 'LineString' || type === 'MultiLineString'
+            ? 2
+            : 1,
+      tags
+    };
+    if (feature.id !== null) {
+      tileFeature.id = feature.id;
+    }
+    tile.features.push(tileFeature);
+  }
+}
+
+// eslint-disable-next-line max-params, max-statements
+function addLine(
+  result,
+  geom,
+  tile: GeoJSONTile,
+  tolerance: number,
+  isPolygon: boolean,
+  isOuter: boolean
+): void {
+  const sqTolerance = tolerance * tolerance;
+
+  if (tolerance > 0 && geom.size < (isPolygon ? sqTolerance : tolerance)) {
+    tile.numPoints += geom.length / 3;
+    return;
+  }
+
+  const ring: number[] = [];
+
+  for (let i = 0; i < geom.length; i += 3) {
+    if (tolerance === 0 || geom[i + 2] > sqTolerance) {
+      tile.numSimplified++;
+      ring.push(geom[i], geom[i + 1]);
+    }
+    tile.numPoints++;
+  }
+
+  if (isPolygon) rewind(ring, isOuter);
+
+  result.push(ring);
+}
+
+function rewind(ring: number[], clockwise?: boolean): void {
+  let area = 0;
+  for (let i = 0, j = ring.length - 2; i < ring.length; j = i, i += 2) {
+    area += (ring[i] - ring[j]) * (ring[i + 1] + ring[j + 1]);
+  }
+  if (area > 0 === clockwise) {
+    for (let i = 0, len = ring.length; i < len / 2; i += 2) {
+      const x = ring[i];
+      const y = ring[i + 1];
+      ring[i] = ring[len - 2 - i];
+      ring[i + 1] = ring[len - 1 - i];
+      ring[len - 2 - i] = x;
+      ring[len - 1 - i] = y;
+    }
+  }
+}

package/src/lib/geojson-tiler/transform.ts

@@ -0,0 +1,55 @@
+// loaders.gl, MIT license
+// Forked from https://github.com/mapbox/geojson-vt under compatible ISC license
+
+import type {GeoJSONTile} from './tile';
+
+/**
+ * Transforms the coordinates of each feature in the given tile from
+ * mercator-projected space into (extent x extent) tile space.
+ */
+export function transformTile(tile: GeoJSONTile, extent: number): GeoJSONTile {
+  if (tile.transformed) {
+    return tile;
+  }
+
+  const z2 = 1 << tile.z;
+  const tx = tile.x;
+  const ty = tile.y;
+
+  for (const feature of tile.features) {
+    const geom = feature.geometry;
+    const type = feature.type;
+
+    feature.geometry = [];
+
+    if (type === 1) {
+      for (let j = 0; j < geom.length; j += 2) {
+        feature.geometry.push(transformPoint(geom[j], geom[j + 1], extent, z2, tx, ty));
+      }
+    } else {
+      for (let j = 0; j < geom.length; j++) {
+        const ring: number[][] = [];
+        for (let k = 0; k < geom[j].length; k += 2) {
+          ring.push(transformPoint(geom[j][k], geom[j][k + 1], extent, z2, tx, ty));
+        }
+        feature.geometry.push(ring);
+      }
+    }
+  }
+
+  tile.transformed = true;
+
+  return tile;
+}
+
+// eslint-disable-next-line max-params
+function transformPoint(
+  x: number,
+  y: number,
+  extent: number,
+  z2: number,
+  tx: number,
+  ty: number
+): number[] {
+  return [Math.round(extent * (x * z2 - tx)), Math.round(extent * (y * z2 - ty))];
+}

package/src/lib/geojson-tiler/wrap.ts

@@ -0,0 +1,108 @@
+// loaders.gl, MIT license
+// Forked from https://github.com/mapbox/geojson-vt under compatible ISC license
+
+import type {GeoJSONTileFeature} from './tile';
+import {clip} from './clip';
+import {createFeature} from './feature';
+
+/**
+ * Options for wrap()
+ */
+export type WrapOptions = {
+  buffer: number /** number of pixels of buffer for the tile */;
+  extent: number /** extent of each tile */;
+  lineMetrics: boolean;
+};
+
+/**
+ * Wrap across antemeridian, by clipping into two tiles, shifting the overflowing x coordinates
+ * @param features list of features to be wrapped
+ * @param options buffer and extent
+ * @returns
+ */
+export function wrap(features: GeoJSONTileFeature[], options: WrapOptions) {
+  const buffer = options.buffer / options.extent;
+  let merged: GeoJSONTileFeature[] = features;
+  const left = clip(features, 1, -1 - buffer, buffer, 0, -1, 2, options); // left world copy
+  const right = clip(features, 1, 1 - buffer, 2 + buffer, 0, -1, 2, options); // right world copy
+
+  if (left || right) {
+    merged = clip(features, 1, -buffer, 1 + buffer, 0, -1, 2, options) || []; // center world copy
+
+    if (left) {
+      merged = shiftFeatureCoords(left, 1).concat(merged); // merge left into center
+    }
+    if (right) {
+      merged = merged.concat(shiftFeatureCoords(right, -1)); // merge right into center
+    }
+  }
+
+  return merged;
+}
+
+/**
+ * Shift the x coordinates of a list of features
+ * @param features list of features to shift x coordinates for
+ * @param offset
+ * @returns
+ */
+function shiftFeatureCoords(features: GeoJSONTileFeature[], offset: number): GeoJSONTileFeature[] {
+  const newFeatures: GeoJSONTileFeature[] = [];
+
+  for (let i = 0; i < features.length; i++) {
+    const feature = features[i];
+    const type = feature.type;
+
+    let newGeometry;
+
+    if (type === 'Point' || type === 'MultiPoint' || type === 'LineString') {
+      newGeometry = shiftCoords(feature.geometry, offset);
+    } else if (type === 'MultiLineString' || type === 'Polygon') {
+      newGeometry = [];
+      for (const line of feature.geometry) {
+        newGeometry.push(shiftCoords(line, offset));
+      }
+    } else if (type === 'MultiPolygon') {
+      newGeometry = [];
+      for (const polygon of feature.geometry) {
+        const newPolygon: Points = [];
+        for (const line of polygon) {
+          // @ts-expect-error TODO
+          newPolygon.push(shiftCoords(line, offset));
+        }
+        newGeometry.push(newPolygon);
+      }
+    }
+
+    newFeatures.push(createFeature(feature.id, type, newGeometry, feature.tags));
+  }
+
+  return newFeatures;
+}
+
+class Points extends Array<number> {
+  size?: number;
+  start?: number;
+  end?: number;
+}
+
+/**
+ * Shift the x coordinate of every point
+ * @param points
+ * @param offset
+ * @returns
+ */
+function shiftCoords(points: Points, offset: number): Points {
+  const newPoints: Points = [];
+  newPoints.size = points.size;
+
+  if (points.start !== undefined) {
+    newPoints.start = points.start;
+    newPoints.end = points.end;
+  }
+
+  for (let i = 0; i < points.length; i += 3) {
+    newPoints.push(points[i] + offset, points[i + 1], points[i + 2]);
+  }
+  return newPoints;
+}

package/src/lib/mapbox-vector-tile/vector-tile-feature.ts

@@ -1,6 +1,6 @@
 // This code is forked from https://github.com/mapbox/vector-tile-js under BSD 3-clause license.
 import Protobuf from 'pbf';
-import {MvtMapboxCoordinates, MvtMapboxGeometry} from '../types';
+import {MVTMapboxCoordinates, MVTMapboxGeometry} from '../types';
 import {readFeature, classifyRings} from '../../helpers/mapbox-util-functions';
 
 export default class VectorTileFeature {
@@ -39,7 +39,7 @@ export default class VectorTileFeature {
   }
 
   // eslint-disable-next-line complexity, max-statements
-  loadGeometry(): MvtMapboxGeometry {
+  loadGeometry(): MVTMapboxGeometry {
     const pbf = this._pbf;
     pbf.pos = this._geometry;
 
@@ -163,7 +163,7 @@ export default class VectorTileFeature {
       type = `Multi${type}`;
     }
 
-    const result: MvtMapboxCoordinates = {
+    const result: MVTMapboxCoordinates = {
       type: 'Feature',
       geometry: {
         type,
@@ -181,7 +181,7 @@ export default class VectorTileFeature {
 
   toGeoJSON(
     options: {x: number; y: number; z: number} | ((data: number[], feature: {extent: any}) => void)
-  ): MvtMapboxCoordinates {
+  ): MVTMapboxCoordinates {
     if (typeof options === 'function') {
       return this._toGeoJSON(options);
     }

package/src/lib/parse-mvt.ts

@@ -1,13 +1,19 @@
-// import {VectorTile} from '@mapbox/vector-tile';
+import {flatGeojsonToBinary} from '@loaders.gl/gis';
+import type {
+  FlatFeature,
+  Feature,
+  GeojsonGeometryInfo,
+  BinaryFeatures,
+  GeoJSONRowTable
+} from '@loaders.gl/schema';
+import Protobuf from 'pbf';
+
+import type {MVTMapboxCoordinates, MVTOptions, MVTLoaderOptions} from '../lib/types';
+
 import VectorTile from './mapbox-vector-tile/vector-tile';
 import BinaryVectorTile from './binary-vector-tile/vector-tile';
-
-import {featuresToBinary} from './binary-vector-tile/features-to-binary';
-import Protobuf from 'pbf';
-import {MvtBinaryCoordinates, MvtMapboxCoordinates, MvtOptions} from '../lib/types';
 import VectorTileFeatureBinary from './binary-vector-tile/vector-tile-feature';
 import VectorTileFeatureMapBox from './mapbox-vector-tile/vector-tile-feature';
-import {LoaderOptions} from '@loaders.gl/loader-utils/';
 
 /**
  * Parse MVT arrayBuffer and return GeoJSON.
@@ -16,93 +22,130 @@ import {LoaderOptions} from '@loaders.gl/loader-utils/';
  * @param options
  * @returns A GeoJSON geometry object or a binary representation
  */
-export default function parseMVT(arrayBuffer: ArrayBuffer, options?: LoaderOptions) {
-  options = normalizeOptions(options);
-  const features: (MvtBinaryCoordinates | MvtMapboxCoordinates)[] = [];
-
-  if (options) {
-    const binary = options.gis.format === 'binary';
-    const firstPassData = {
-      pointPositionsCount: 0,
-      pointFeaturesCount: 0,
-      linePositionsCount: 0,
-      linePathsCount: 0,
-      lineFeaturesCount: 0,
-      polygonPositionsCount: 0,
-      polygonObjectsCount: 0,
-      polygonRingsCount: 0,
-      polygonFeaturesCount: 0
-    };
-
-    if (arrayBuffer.byteLength > 0) {
-      const tile = binary
-        ? new BinaryVectorTile(new Protobuf(arrayBuffer))
-        : new VectorTile(new Protobuf(arrayBuffer));
-      const loaderOptions = options.mvt;
-
-      const selectedLayers = Array.isArray(loaderOptions.layers)
-        ? loaderOptions.layers
-        : Object.keys(tile.layers);
-
-      selectedLayers.forEach((layerName: string) => {
-        const vectorTileLayer = tile.layers[layerName];
-        const featureOptions = {...loaderOptions, layerName};
-
-        if (!vectorTileLayer) {
-          return;
-        }
-
-        for (let i = 0; i < vectorTileLayer.length; i++) {
-          const vectorTileFeature = vectorTileLayer.feature(i, firstPassData);
-
-          const decodedFeature = binary
-            ? getDecodedFeatureBinary(vectorTileFeature as VectorTileFeatureBinary, featureOptions)
-            : getDecodedFeature(vectorTileFeature as VectorTileFeatureMapBox, featureOptions);
-          features.push(decodedFeature);
-        }
-      });
+export default function parseMVT(arrayBuffer: ArrayBuffer, options?: MVTLoaderOptions) {
+  const mvtOptions = normalizeOptions(options);
+
+  const shape = options?.gis?.format || options?.mvt?.shape;
+  switch (shape) {
+    case 'columnar-table': // binary + some JS arrays
+      return {shape: 'columnar-table', data: parseToBinary(arrayBuffer, mvtOptions)};
+    case 'geojson-row-table': {
+      const table: GeoJSONRowTable = {
+        shape: 'geojson-row-table',
+        data: parseToGeojson(arrayBuffer, mvtOptions)
+      };
+      return table;
     }
+    case 'geojson':
+      return parseToGeojson(arrayBuffer, mvtOptions);
+    case 'binary-geometry':
+      return parseToBinary(arrayBuffer, mvtOptions);
+    case 'binary':
+      return parseToBinary(arrayBuffer, mvtOptions);
+    default:
+      throw new Error(shape);
+  }
+}
 
-    if (binary) {
-      const data = featuresToBinary(features as MvtBinaryCoordinates[], firstPassData);
-      // Add the original byteLength (as a reasonable approximation of the size of the binary data)
-      // TODO decide where to store extra fields like byteLength (header etc) and document
-      // @ts-ignore
-      data.byteLength = arrayBuffer.byteLength;
-      return data;
-    }
+function parseToBinary(arrayBuffer: ArrayBuffer, options: MVTOptions): BinaryFeatures {
+  const [flatGeoJsonFeatures, geometryInfo] = parseToFlatGeoJson(arrayBuffer, options);
+
+  const binaryData = flatGeojsonToBinary(flatGeoJsonFeatures, geometryInfo);
+  // Add the original byteLength (as a reasonable approximation of the size of the binary data)
+  // TODO decide where to store extra fields like byteLength (header etc) and document
+  // @ts-ignore
+  binaryData.byteLength = arrayBuffer.byteLength;
+  return binaryData;
+}
+
+function parseToFlatGeoJson(
+  arrayBuffer: ArrayBuffer,
+  options: MVTOptions
+): [FlatFeature[], GeojsonGeometryInfo] {
+  const features: FlatFeature[] = [];
+  const geometryInfo: GeojsonGeometryInfo = {
+    coordLength: 2,
+    pointPositionsCount: 0,
+    pointFeaturesCount: 0,
+    linePositionsCount: 0,
+    linePathsCount: 0,
+    lineFeaturesCount: 0,
+    polygonPositionsCount: 0,
+    polygonObjectsCount: 0,
+    polygonRingsCount: 0,
+    polygonFeaturesCount: 0
+  };
+
+  if (arrayBuffer.byteLength <= 0) {
+    return [features, geometryInfo];
   }
-  return features;
+
+  const tile = new BinaryVectorTile(new Protobuf(arrayBuffer));
+
+  const selectedLayers =
+    options && Array.isArray(options.layers) ? options.layers : Object.keys(tile.layers);
+
+  selectedLayers.forEach((layerName: string) => {
+    const vectorTileLayer = tile.layers[layerName];
+    if (!vectorTileLayer) {
+      return;
+    }
+
+    for (let i = 0; i < vectorTileLayer.length; i++) {
+      const vectorTileFeature = vectorTileLayer.feature(i, geometryInfo);
+      const decodedFeature = getDecodedFeatureBinary(vectorTileFeature, options, layerName);
+      features.push(decodedFeature);
+    }
+  });
+
+  return [features, geometryInfo];
 }
 
-/**
- * @param options
- * @returns options
- */
-function normalizeOptions(options: LoaderOptions | undefined) {
-  if (options) {
-    options = {
-      ...options,
-      mvt: options.mvt || {},
-      gis: options.gis || {}
-    };
-
-    // Validate
-    const wgs84Coordinates = options.coordinates === 'wgs84';
-    const {tileIndex} = options;
-    const hasTileIndex =
-      tileIndex &&
-      Number.isFinite(tileIndex.x) &&
-      Number.isFinite(tileIndex.y) &&
-      Number.isFinite(tileIndex.z);
-
-    if (wgs84Coordinates && !hasTileIndex) {
-      throw new Error(
-        'MVT Loader: WGS84 coordinates need tileIndex property. Check documentation.'
-      );
+function parseToGeojson(arrayBuffer: ArrayBuffer, options: MVTOptions): Feature[] {
+  if (arrayBuffer.byteLength <= 0) {
+    return [];
+  }
+
+  const features: MVTMapboxCoordinates[] = [];
+  const tile = new VectorTile(new Protobuf(arrayBuffer));
+
+  const selectedLayers = Array.isArray(options.layers) ? options.layers : Object.keys(tile.layers);
+
+  selectedLayers.forEach((layerName: string) => {
+    const vectorTileLayer = tile.layers[layerName];
+    if (!vectorTileLayer) {
+      return;
     }
+
+    for (let i = 0; i < vectorTileLayer.length; i++) {
+      const vectorTileFeature = vectorTileLayer.feature(i);
+      const decodedFeature = getDecodedFeature(vectorTileFeature, options, layerName);
+      features.push(decodedFeature);
+    }
+  });
+
+  return features as Feature[];
+}
+
+function normalizeOptions(options?: MVTLoaderOptions): MVTOptions {
+  if (!options?.mvt) {
+    throw new Error('mvt options required');
   }
-  return options;
+
+  // Validate
+  const wgs84Coordinates = options.mvt?.coordinates === 'wgs84';
+  const {tileIndex} = options.mvt;
+  const hasTileIndex =
+    tileIndex &&
+    Number.isFinite(tileIndex.x) &&
+    Number.isFinite(tileIndex.y) &&
+    Number.isFinite(tileIndex.z);
+
+  if (wgs84Coordinates && !hasTileIndex) {
+    throw new Error('MVT Loader: WGS84 coordinates need tileIndex property');
+  }
+
+  return options.mvt;
 }
 
 /**
@@ -112,15 +155,16 @@ function normalizeOptions(options: LoaderOptions | undefined) {
  */
 function getDecodedFeature(
   feature: VectorTileFeatureMapBox,
-  options: MvtOptions
-): MvtMapboxCoordinates {
+  options: MVTOptions,
+  layerName: string
+): MVTMapboxCoordinates {
   const decodedFeature = feature.toGeoJSON(
     options.coordinates === 'wgs84' ? options.tileIndex : transformToLocalCoordinates
   );
 
   // Add layer name to GeoJSON properties
   if (options.layerProperty) {
-    decodedFeature.properties[options.layerProperty] = options.layerName;
+    decodedFeature.properties[options.layerProperty] = layerName;
   }
 
   return decodedFeature;
@@ -133,15 +177,16 @@ function getDecodedFeature(
  */
 function getDecodedFeatureBinary(
   feature: VectorTileFeatureBinary,
-  options: MvtOptions
-): MvtBinaryCoordinates {
+  options: MVTOptions,
+  layerName: string
+): FlatFeature {
   const decodedFeature = feature.toBinaryCoordinates(
     options.coordinates === 'wgs84' ? options.tileIndex : transformToLocalCoordinatesBinary
   );
 
   // Add layer name to GeoJSON properties
-  if (options.layerProperty) {
-    decodedFeature.properties[options.layerProperty] = options.layerName;
+  if (options.layerProperty && decodedFeature.properties) {
+    decodedFeature.properties[options.layerProperty] = layerName;
   }
 
   return decodedFeature;