@mapwhit/tilerenderer 1.0.0 → 1.1.1

package/src/source/source_state.js

@@ -21,7 +21,9 @@ class SourceFeatureState {
     if (this.#deletedStates[sourceLayer] === null) {
       this.#deletedStates[sourceLayer] = {};
       for (const ft in this.#state[sourceLayer]) {
-        if (ft !== feature) this.#deletedStates[sourceLayer][ft] = null;
+        if (ft !== feature) {
+          this.#deletedStates[sourceLayer][ft] = null;
+        }
       }
     } else {
       const featureDeletionQueued =
@@ -29,12 +31,16 @@ class SourceFeatureState {
       if (featureDeletionQueued) {
         this.#deletedStates[sourceLayer][feature] = {};
         for (const prop in this.state[sourceLayer][feature]) {
-          if (!newState[prop]) this.#deletedStates[sourceLayer][feature][prop] = null;
+          if (!newState[prop]) {
+            this.#deletedStates[sourceLayer][feature][prop] = null;
+          }
         }
       } else {
         for (const key in newState) {
           const deletionInQueue = this.#deletedStates[sourceLayer]?.[feature]?.[key] === null;
-          if (deletionInQueue) delete this.#deletedStates[sourceLayer][feature][key];
+          if (deletionInQueue) {
+            delete this.#deletedStates[sourceLayer][feature][key];
+          }
         }
       }
     }
@@ -42,7 +48,9 @@ class SourceFeatureState {
 
   removeFeatureState(sourceLayer, featureId, key) {
     const sourceLayerDeleted = this.#deletedStates[sourceLayer] === null;
-    if (sourceLayerDeleted) return;
+    if (sourceLayerDeleted) {
+      return;
+    }
 
     const feature = String(featureId);
 
@@ -57,7 +65,9 @@ class SourceFeatureState {
       const updateInQueue = this.#stateChanges[sourceLayer]?.[feature];
       if (updateInQueue) {
         this.#deletedStates[sourceLayer][feature] = {};
-        for (key in this.#stateChanges[sourceLayer][feature]) this.#deletedStates[sourceLayer][feature][key] = null;
+        for (key in this.#stateChanges[sourceLayer][feature]) {
+          this.#deletedStates[sourceLayer][feature][key] = null;
+        }
       } else {
         this.#deletedStates[sourceLayer][feature] = null;
       }
@@ -72,11 +82,17 @@ class SourceFeatureState {
     const reconciledState = Object.assign({}, base?.[feature], changes?.[feature]);
 
     //return empty object if the whole source layer is awaiting deletion
-    if (this.#deletedStates[sourceLayer] === null) return {};
+    if (this.#deletedStates[sourceLayer] === null) {
+      return {};
+    }
     if (this.#deletedStates[sourceLayer]) {
       const featureDeletions = this.#deletedStates[sourceLayer][feature];
-      if (featureDeletions === null) return {};
-      for (const prop in featureDeletions) delete reconciledState[prop];
+      if (featureDeletions === null) {
+        return {};
+      }
+      for (const prop in featureDeletions) {
+        delete reconciledState[prop];
+      }
     }
     return reconciledState;
   }
@@ -92,7 +108,9 @@ class SourceFeatureState {
       this.#state[sourceLayer] ??= {};
       const layerStates = {};
       for (const feature in this.#stateChanges[sourceLayer]) {
-        if (!this.#state[sourceLayer][feature]) this.#state[sourceLayer][feature] = {};
+        if (!this.#state[sourceLayer][feature]) {
+          this.#state[sourceLayer][feature] = {};
+        }
         Object.assign(this.#state[sourceLayer][feature], this.#stateChanges[sourceLayer][feature]);
         layerStates[feature] = this.#state[sourceLayer][feature];
       }
@@ -103,13 +121,16 @@ class SourceFeatureState {
       const layerStates = {};
 
       if (this.#deletedStates[sourceLayer] === null) {
-        for (const ft in this.#state[sourceLayer]) layerStates[ft] = {};
+        for (const ft in this.#state[sourceLayer]) {
+          layerStates[ft] = {};
+        }
         this.#state[sourceLayer] = {};
       } else {
         for (const feature in this.#deletedStates[sourceLayer]) {
           const deleteWholeFeatureState = this.#deletedStates[sourceLayer][feature] === null;
-          if (deleteWholeFeatureState) this.#state[sourceLayer][feature] = {};
-          else {
+          if (deleteWholeFeatureState) {
+            this.#state[sourceLayer][feature] = {};
+          } else {
             for (const key of Object.keys(this.#deletedStates[sourceLayer][feature])) {
               delete this.#state[sourceLayer][feature][key];
             }
@@ -124,7 +145,9 @@ class SourceFeatureState {
     this.#stateChanges = {};
     this.#deletedStates = {};
 
-    if (Object.keys(featuresChanged).length === 0) return;
+    if (Object.keys(featuresChanged).length === 0) {
+      return;
+    }
 
     for (const tile of tiles) {
       tile.setFeatureState(featuresChanged, painter);
@@ -132,4 +155,4 @@ class SourceFeatureState {
   }
 }
 
-module.exports = SourceFeatureState;
+export default SourceFeatureState;

package/src/source/tile.js

@@ -1,17 +1,16 @@
-const { deepEqual } = require('../util/object');
-const uniqueId = require('../util/unique_id');
-const { updateBuckets } = require('../data/bucket');
-const GeoJSONFeature = require('../util/vectortile_to_geojson');
-const featureFilter = require('../style-spec/feature_filter');
-const SymbolBucket = require('../data/bucket/symbol_bucket');
-const { RasterBoundsArray, CollisionBoxArray } = require('../data/array_types');
-const rasterBoundsAttributes = require('../data/raster_bounds_attributes');
-const EXTENT = require('../data/extent');
-const Texture = require('../render/texture');
-const SegmentVector = require('../data/segment');
-const { TriangleIndexArray } = require('../data/index_array_type');
-const browser = require('../util/browser');
-const EvaluationParameters = require('../style/evaluation_parameters');
+import { CollisionBoxArray, RasterBoundsArray } from '../data/array_types.js';
+import { updateBuckets } from '../data/bucket.js';
+import EXTENT from '../data/extent.js';
+import { TriangleIndexArray } from '../data/index_array_type.js';
+import rasterBoundsAttributes from '../data/raster_bounds_attributes.js';
+import SegmentVector from '../data/segment.js';
+import Texture from '../render/texture.js';
+import EvaluationParameters from '../style/evaluation_parameters.js';
+import featureFilter from '../style-spec/feature_filter/index.js';
+import browser from '../util/browser.js';
+import { deepEqual } from '../util/object.js';
+import uniqueId from '../util/unique_id.js';
+import GeoJSONFeature from '../util/vectortile_to_geojson.js';
 
 /**
  * A tile object is the combination of a Coordinate, which defines
@@ -38,8 +37,12 @@ class Tile {
 
   registerFadeDuration(duration) {
     const fadeEndTime = duration + this.timeAdded;
-    if (fadeEndTime < browser.now()) return;
-    if (this.fadeEndTime && fadeEndTime < this.fadeEndTime) return;
+    if (fadeEndTime < browser.now()) {
+      return;
+    }
+    if (this.fadeEndTime && fadeEndTime < this.fadeEndTime) {
+      return;
+    }
 
     this.fadeEndTime = fadeEndTime;
   }
@@ -164,7 +167,9 @@ class Tile {
     maxPitchScaleFactor,
     pixelPosMatrix
   ) {
-    if (!this.latestFeatureIndex?.vectorTile) return {};
+    if (!this.latestFeatureIndex?.vectorTile) {
+      return {};
+    }
 
     return this.latestFeatureIndex.query(
       {
@@ -183,14 +188,18 @@ class Tile {
   }
 
   querySourceFeatures(result, params) {
-    if (!this.latestFeatureIndex?.vectorTile) return;
+    if (!this.latestFeatureIndex?.vectorTile) {
+      return;
+    }
 
     const vtLayers = this.latestFeatureIndex.loadVTLayers();
 
     const sourceLayer = params ? params.sourceLayer : '';
     const layer = vtLayers._geojsonTileLayer || vtLayers[sourceLayer];
 
-    if (!layer) return;
+    if (!layer) {
+      return;
+    }
 
     const filter = featureFilter(params?.filter);
     const { z, x, y } = this.tileID.canonical;
@@ -223,14 +232,18 @@ class Tile {
 
   setMask(mask, context) {
     // don't redo buffer work if the mask is the same;
-    if (deepEqual(this.mask, mask)) return;
+    if (deepEqual(this.mask, mask)) {
+      return;
+    }
 
     this.mask = mask;
     this.clearMask();
 
     // We want to render the full tile, and keeping the segments/vertices/indices empty means
     // using the global shared buffers for covering the entire tile.
-    if (deepEqual(mask, { 0: true })) return;
+    if (deepEqual(mask, { 0: true })) {
+      return;
+    }
 
     const maskedBoundsArray = new RasterBoundsArray();
     const indexArray = new TriangleIndexArray();
@@ -290,7 +303,9 @@ class Tile {
       const sourceLayerId = bucket.layers[0]['sourceLayer'] || '_geojsonTileLayer';
       const sourceLayer = vtLayers[sourceLayerId];
       const sourceLayerStates = states[sourceLayerId];
-      if (!sourceLayer || !sourceLayerStates || Object.keys(sourceLayerStates).length === 0) continue;
+      if (!sourceLayer || !sourceLayerStates || Object.keys(sourceLayerStates).length === 0) {
+        continue;
+      }
 
       bucket.update(sourceLayerStates, sourceLayer, this.imageAtlas?.patternPositions || {});
       if (painter?.style) {
@@ -316,4 +331,4 @@ class Tile {
   }
 }
 
-module.exports = Tile;
+export default Tile;

package/src/source/tile_bounds.js

@@ -1,6 +1,5 @@
-const LngLatBounds = require('../geo/lng_lat_bounds');
-
-const { clamp } = require('../util/util');
+import LngLatBounds from '../geo/lng_lat_bounds.js';
+import { clamp } from '../util/util.js';
 
 class TileBounds {
   constructor(bounds, minzoom = 0, maxzoom = 24) {
@@ -11,11 +10,17 @@ class TileBounds {
 
   contains({ x, y, z }) {
     const minX = Math.floor(lngX(this.bounds.getWest(), z));
-    if (x < minX) return false;
+    if (x < minX) {
+      return false;
+    }
     const maxX = Math.ceil(lngX(this.bounds.getEast(), z));
-    if (x >= maxX) return false;
+    if (x >= maxX) {
+      return false;
+    }
     const minY = Math.floor(latY(this.bounds.getNorth(), z));
-    if (y < minY) return false;
+    if (y < minY) {
+      return false;
+    }
     const maxY = Math.ceil(latY(this.bounds.getSouth(), z));
     return y < maxY;
   }
@@ -23,7 +28,9 @@ class TileBounds {
 
 function validateBounds(bounds) {
   // make sure the bounds property contains valid longitude and latitudes
-  if (!Array.isArray(bounds) || bounds.length !== 4) return [-180, -90, 180, 90];
+  if (!Array.isArray(bounds) || bounds.length !== 4) {
+    return [-180, -90, 180, 90];
+  }
   return [Math.max(-180, bounds[0]), Math.max(-90, bounds[1]), Math.min(180, bounds[2]), Math.min(90, bounds[3])];
 }
 
@@ -37,4 +44,4 @@ function latY(lat, zoom) {
   return 2 ** (zoom - 1) + 0.5 * Math.log((1 + f) / (1 - f)) * -scale;
 }
 
-module.exports = TileBounds;
+export default TileBounds;

package/src/source/tile_cache.js

@@ -1,4 +1,4 @@
-const assert = require('assert');
+import assert from 'assert';
 
 /**
  * A [fifo cache](http://en.wikipedia.org/wiki/Cache_algorithms)
@@ -119,4 +119,4 @@ class TileCache {
   }
 }
 
-module.exports = TileCache;
+export default TileCache;

package/src/source/tile_id.js

@@ -1,9 +1,7 @@
-const { getTileBBox } = require('@mapbox/whoots-js');
+import assert from 'assert';
+import Coordinate from '../geo/coordinate.js';
 
-const assert = require('assert');
-const Coordinate = require('../geo/coordinate');
-
-class CanonicalTileID {
+export class CanonicalTileID {
   constructor(z, x, y) {
     assert(z >= 0 && z <= 25);
     assert(x >= 0 && x < 2 ** z);
@@ -23,7 +21,7 @@ class CanonicalTileID {
   }
 }
 
-class UnwrappedTileID {
+export class UnwrappedTileID {
   constructor(wrap, canonical) {
     this.wrap = wrap;
     this.canonical = canonical;
@@ -31,7 +29,7 @@ class UnwrappedTileID {
   }
 }
 
-class OverscaledTileID {
+export class OverscaledTileID {
   constructor(overscaledZ, wrap, z, x, y) {
     assert(overscaledZ >= z);
     this.overscaledZ = overscaledZ;
@@ -90,16 +88,30 @@ class OverscaledTileID {
   }
 
   isLessThan(rhs) {
-    if (this.wrap < rhs.wrap) return true;
-    if (this.wrap > rhs.wrap) return false;
+    if (this.wrap < rhs.wrap) {
+      return true;
+    }
+    if (this.wrap > rhs.wrap) {
+      return false;
+    }
 
-    if (this.overscaledZ < rhs.overscaledZ) return true;
-    if (this.overscaledZ > rhs.overscaledZ) return false;
+    if (this.overscaledZ < rhs.overscaledZ) {
+      return true;
+    }
+    if (this.overscaledZ > rhs.overscaledZ) {
+      return false;
+    }
 
-    if (this.canonical.x < rhs.canonical.x) return true;
-    if (this.canonical.x > rhs.canonical.x) return false;
+    if (this.canonical.x < rhs.canonical.x) {
+      return true;
+    }
+    if (this.canonical.x > rhs.canonical.x) {
+      return false;
+    }
 
-    if (this.canonical.y < rhs.canonical.y) return true;
+    if (this.canonical.y < rhs.canonical.y) {
+      return true;
+    }
     return false;
   }
 
@@ -132,16 +144,11 @@ class OverscaledTileID {
   }
 }
 
-function calculateKey(wrap, z, x, y) {
+export function calculateKey(wrap, z, x, y) {
   wrap *= 2;
-  if (wrap < 0) wrap = wrap * -1 - 1;
+  if (wrap < 0) {
+    wrap = wrap * -1 - 1;
+  }
   const dim = 1 << z;
   return (dim * dim * wrap + dim * y + x) * 32 + z;
 }
-
-module.exports = {
-  CanonicalTileID,
-  UnwrappedTileID,
-  OverscaledTileID,
-  calculateKey
-};

package/src/source/vector_tile_source.js

@@ -1,9 +1,9 @@
-const { Event, ErrorEvent, Evented } = require('@mapwhit/events');
-const { pick } = require('../util/object');
-const loadTileJSON = require('./load_tilejson');
-const TileBounds = require('./tile_bounds');
-const browser = require('../util/browser');
-const VectorTileWorkerSource = require('./vector_tile_worker_source');
+import { ErrorEvent, Event, Evented } from '@mapwhit/events';
+import browser from '../util/browser.js';
+import { pick } from '../util/object.js';
+import loadTileJSON from './load_tilejson.js';
+import TileBounds from './tile_bounds.js';
+import VectorTileWorkerSource from './vector_tile_worker_source.js';
 
 class VectorTileSource extends Evented {
   #worker;
@@ -38,7 +38,9 @@ class VectorTileSource extends Evented {
     try {
       const tileJSON = await loadTileJSON(this._options);
       Object.assign(this, tileJSON);
-      if (tileJSON.bounds) this.tileBounds = new TileBounds(tileJSON.bounds, this.minzoom, this.maxzoom);
+      if (tileJSON.bounds) {
+        this.tileBounds = new TileBounds(tileJSON.bounds, this.minzoom, this.maxzoom);
+      }
 
       // `content` is included here to prevent a race condition where `Style#_updateSources` is called
       // before the TileJSON arrives. this makes sure the tiles needed are loaded once TileJSON arrives
@@ -125,4 +127,4 @@ class VectorTileSource extends Evented {
   }
 }
 
-module.exports = VectorTileSource;
+export default VectorTileSource;

package/src/source/vector_tile_worker_source.js

@@ -1,6 +1,6 @@
-const { VectorTile } = require('@mapwhit/vector-tile');
-const Protobuf = require('@mapwhit/pbf');
-const makeWorkerTile = require('./worker_tile');
+import Protobuf from '@mapwhit/pbf';
+import { VectorTile } from '@mapwhit/vector-tile';
+import makeWorkerTile from './worker_tile.js';
 
 /**
  * The {@link WorkerSource} implementation that supports {@link VectorTileSource}.
@@ -55,4 +55,4 @@ class VectorTileWorkerSource {
   }
 }
 
-module.exports = VectorTileWorkerSource;
+export default VectorTileWorkerSource;

package/src/source/worker_tile.js

@@ -1,27 +1,23 @@
-const FeatureIndex = require('../data/feature_index');
-
-const { performSymbolLayout } = require('../symbol/symbol_layout');
-const { CollisionBoxArray } = require('../data/array_types');
-const dictionaryCoder = require('../util/dictionary_coder');
-const SymbolBucket = require('../data/bucket/symbol_bucket');
-const LineBucket = require('../data/bucket/line_bucket');
-const FillBucket = require('../data/bucket/fill_bucket');
-const FillExtrusionBucket = require('../data/bucket/fill_extrusion_bucket');
-const { mapObject } = require('../util/object');
-const warn = require('../util/warn');
-const assert = require('assert');
-const ImageAtlas = require('../render/image_atlas');
-const GlyphAtlas = require('../render/glyph_atlas');
-const EvaluationParameters = require('../style/evaluation_parameters');
-const { OverscaledTileID } = require('./tile_id');
-
-module.exports = makeWorkerTile;
+import { CollisionBoxArray } from '../data/array_types.js';
+import FillBucket from '../data/bucket/fill_bucket.js';
+import FillExtrusionBucket from '../data/bucket/fill_extrusion_bucket.js';
+import LineBucket from '../data/bucket/line_bucket.js';
+import SymbolBucket from '../data/bucket/symbol_bucket.js';
+import FeatureIndex from '../data/feature_index.js';
+import GlyphAtlas from '../render/glyph_atlas.js';
+import ImageAtlas from '../render/image_atlas.js';
+import EvaluationParameters from '../style/evaluation_parameters.js';
+import { performSymbolLayout } from '../symbol/symbol_layout.js';
+import dictionaryCoder from '../util/dictionary_coder.js';
+import { mapObject } from '../util/object.js';
+import { OverscaledTileID } from './tile_id.js';
+export default makeWorkerTile;
 
 async function makeWorkerTile(params, vectorTile, layerIndex, resources) {
   const tileID = createTileID(params);
 
   const overscaling = tileID.overscaleFactor();
-  const { uid, zoom, pixelRatio, source, showCollisionBoxes, globalState, justReloaded, painter } = params;
+  const { zoom, pixelRatio, source, showCollisionBoxes, globalState, justReloaded, painter } = params;
 
   const collisionBoxArray = new CollisionBoxArray();
   const sourceLayerCoder = dictionaryCoder(Object.keys(vectorTile.layers));
@@ -54,9 +50,15 @@ async function makeWorkerTile(params, vectorTile, layerIndex, resources) {
     for (const layers of sourceLayerFamilies.values()) {
       const layer = layers[0];
 
-      if (layer.minzoom && zoom < Math.floor(layer.minzoom)) continue;
-      if (layer.maxzoom && zoom >= layer.maxzoom) continue;
-      if (layer.visibility === 'none') continue;
+      if (layer.minzoom && zoom < Math.floor(layer.minzoom)) {
+        continue;
+      }
+      if (layer.maxzoom && zoom >= layer.maxzoom) {
+        continue;
+      }
+      if (layer.visibility === 'none') {
+        continue;
+      }
 
       recalculateLayers(layers, zoom, globalState);
 

package/src/style/create_style_layer.js

@@ -1,12 +1,12 @@
-const circle = require('./style_layer/circle_style_layer');
-const heatmap = require('./style_layer/heatmap_style_layer');
-const hillshade = require('./style_layer/hillshade_style_layer');
-const fill = require('./style_layer/fill_style_layer');
-const { FillExtrusionStyleLayer: fillExtrusion } = require('./style_layer/fill_extrusion_style_layer');
-const line = require('./style_layer/line_style_layer');
-const symbol = require('./style_layer/symbol_style_layer');
-const background = require('./style_layer/background_style_layer');
-const raster = require('./style_layer/raster_style_layer');
+import background from './style_layer/background_style_layer.js';
+import circle from './style_layer/circle_style_layer.js';
+import { FillExtrusionStyleLayer as fillExtrusion } from './style_layer/fill_extrusion_style_layer.js';
+import fill from './style_layer/fill_style_layer.js';
+import heatmap from './style_layer/heatmap_style_layer.js';
+import hillshade from './style_layer/hillshade_style_layer.js';
+import line from './style_layer/line_style_layer.js';
+import raster from './style_layer/raster_style_layer.js';
+import symbol from './style_layer/symbol_style_layer.js';
 
 const subclasses = {
   circle,
@@ -20,6 +20,6 @@ const subclasses = {
   raster
 };
 
-module.exports = function createStyleLayer(layer) {
+export default function createStyleLayer(layer) {
   return new subclasses[layer.type](layer);
-};
+}

package/src/style/evaluation_parameters.js

@@ -1,8 +1,8 @@
-const ZoomHistory = require('./zoom_history');
-const { isStringInSupportedScript } = require('../util/script_detection');
-const { plugin: rtlTextPlugin } = require('../source/rtl_text_plugin');
+import { plugin as rtlTextPlugin } from '../source/rtl_text_plugin.js';
+import { isStringInSupportedScript } from '../util/script_detection.js';
+import ZoomHistory from './zoom_history.js';
 
-class EvaluationParameters {
+export default class EvaluationParameters {
   // "options" may also be another EvaluationParameters to copy, see CrossFadedProperty.possiblyEvaluate
   constructor(zoom, options) {
     this.zoom = zoom;
@@ -43,5 +43,3 @@ class EvaluationParameters {
       : { fromScale: 0.5, toScale: 1, t: 1 - (1 - t) * fraction };
   }
 }
-
-module.exports = EvaluationParameters;

package/src/style/light.js

@@ -1,6 +1,6 @@
-const { sphericalToCartesian } = require('../util/util');
-const { Evented } = require('@mapwhit/events');
-const interpolate = require('../util/interpolate');
+import { Evented } from '@mapwhit/events';
+import interpolate from '../util/interpolate.js';
+import { sphericalToCartesian } from '../util/util.js';
 
 const lightSpec = {
   anchor: {
@@ -40,7 +40,7 @@ const lightSpec = {
   }
 };
 
-const { Properties, Transitionable, DataConstantProperty } = require('./properties');
+import { DataConstantProperty, Properties, Transitionable } from './properties.js';
 
 class LightPositionProperty {
   constructor(specification) {
@@ -109,4 +109,4 @@ class Light extends Evented {
   }
 }
 
-module.exports = Light;
+export default Light;

package/src/style/load_sprite.js

@@ -1,10 +1,10 @@
-const browser = require('../util/browser');
-const { RGBAImage } = require('../util/image');
-const loadImage = require('../util/loader/image');
+import browser from '../util/browser.js';
+import { RGBAImage } from '../util/image.js';
+import loadImage from '../util/loader/image.js';
+export default loadSprite;
 
-module.exports = loadSprite;
-
-async function loadSprite(sprite) {
+async function loadSprite(loadingSprite) {
+  const sprite = await loadingSprite;
   const image = await loadImage(sprite.image);
   const { json } = sprite;
   if (json && image) {

package/src/style/parse_glyph_pbf.js

@@ -1,7 +1,7 @@
-const { AlphaImage } = require('../util/image');
+import Protobuf from '@mapwhit/pbf';
+import { AlphaImage } from '../util/image.js';
 
-const Protobuf = require('@mapwhit/pbf');
-const border = 3;
+export const GLYPH_PBF_BORDER = 3;
 
 function readFontstacks(tag, glyphs, pbf) {
   if (tag === 1) {
@@ -16,8 +16,8 @@ function readFontstack(tag, glyphs, pbf) {
       id,
       bitmap: new AlphaImage(
         {
-          width: width + 2 * border,
-          height: height + 2 * border
+          width: width + 2 * GLYPH_PBF_BORDER,
+          height: height + 2 * GLYPH_PBF_BORDER
         },
         bitmap
       ),
@@ -27,19 +27,23 @@ function readFontstack(tag, glyphs, pbf) {
 }
 
 function readGlyph(tag, glyph, pbf) {
-  if (tag === 1) glyph.id = pbf.readVarint();
-  else if (tag === 2) glyph.bitmap = pbf.readBytes();
-  else if (tag === 3) glyph.width = pbf.readVarint();
-  else if (tag === 4) glyph.height = pbf.readVarint();
-  else if (tag === 5) glyph.left = pbf.readSVarint();
-  else if (tag === 6) glyph.top = pbf.readSVarint();
-  else if (tag === 7) glyph.advance = pbf.readVarint();
+  if (tag === 1) {
+    glyph.id = pbf.readVarint();
+  } else if (tag === 2) {
+    glyph.bitmap = pbf.readBytes();
+  } else if (tag === 3) {
+    glyph.width = pbf.readVarint();
+  } else if (tag === 4) {
+    glyph.height = pbf.readVarint();
+  } else if (tag === 5) {
+    glyph.left = pbf.readSVarint();
+  } else if (tag === 6) {
+    glyph.top = pbf.readSVarint();
+  } else if (tag === 7) {
+    glyph.advance = pbf.readVarint();
+  }
 }
 
-function parseGlyph(data) {
+export default function parseGlyph(data) {
   return new Protobuf(data).readFields(readFontstacks, []);
 }
-
-parseGlyph.GLYPH_PBF_BORDER = border;
-
-module.exports = parseGlyph;