@navaramap/three 0.0.8 → 0.1.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@navaramap/three",
   "type": "module",
-  "version": "0.0.8",
+  "version": "0.1.0",
   "main": "dist/index.umd.cjs",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -30,13 +30,13 @@
     "astronomy-engine": "2.1.19",
     "stats.js": "0.17.0",
     "three-stdlib": "2.36.1",
-    "@navaramap/core": "0.0.8",
-    "@navaramap/engine-api": "0.0.8",
-    "@navaramap/three-api": "0.0.8",
-    "@navaramap/font": "0.0.8",
-    "@navaramap/three-csm": "0.0.8",
-    "@navaramap/worker": "0.0.8",
-    "@navaramap/engine": "0.0.8"
+    "@navaramap/engine": "0.1.0",
+    "@navaramap/engine-api": "0.1.0",
+    "@navaramap/core": "0.1.0",
+    "@navaramap/three-csm": "0.1.0",
+    "@navaramap/font": "0.1.0",
+    "@navaramap/worker": "0.1.0",
+    "@navaramap/three-api": "0.1.0"
   },
   "devDependencies": {
     "@playwright/test": "1.62.1",
@@ -71,10 +71,10 @@
     "tweakpane": "4.0.5",
     "vite-plugin-glsl": "1.6.0",
     "vite-plugin-static-copy": "4.1.1",
-    "@navaramap/three-default-descs": "0.0.8",
-    "@navaramap/three-default-plugin": "0.0.8",
-    "@navaramap/three-plugins": "0.0.8",
-    "@navaramap/three-react": "0.0.8"
+    "@navaramap/three-default-plugin": "0.1.0",
+    "@navaramap/three-plugins": "0.1.0",
+    "@navaramap/three-default-descs": "0.1.0",
+    "@navaramap/three-react": "0.1.0"
   },
   "scripts": {
     "start": "vite",

package/src/core/MeshDesc.test.ts

@@ -274,15 +274,15 @@ describe("MeshDesc geodetic placement", () => {
 });
 
 describe("MeshDesc terrain-referenced placement", () => {
-  type LatLngRad = { lat: number; lng: number };
+  type LatLngDeg = { lat: number; lng: number };
 
   const terrainView = (height: number | undefined) => {
     const listeners: ((h: number) => void)[] = [];
     const unsubscribe = vi.fn();
     const spy = {
-      sampleTerrainHeight: vi.fn((_pos: LatLngRad) => height),
+      sampleTerrainHeight: vi.fn((_pos: LatLngDeg) => height),
       observeTerrainHeightAt: vi.fn(
-        (_pos: LatLngRad, cb: (h: number) => void) => {
+        (_pos: LatLngDeg, cb: (h: number) => void) => {
           listeners.push(cb);
           return unsubscribe;
         },
@@ -297,8 +297,6 @@ describe("MeshDesc terrain-referenced placement", () => {
     return desc;
   };
 
-  const rad = (deg: number) => (deg * Math.PI) / 180;
-
   it("seeds from the resident-tile sample and subscribes", () => {
     const { view, spy } = terrainView(300);
     createWith(view, {
@@ -308,10 +306,10 @@ describe("MeshDesc terrain-referenced placement", () => {
     expect(spy.sampleTerrainHeight).toHaveBeenCalled();
     expect(spy.observeTerrainHeightAt).toHaveBeenCalled();
 
-    // Both engine methods take RADIANS, while `geodetic` is degrees.
+    // Both terrain methods take the same degrees `geodetic` carries.
     const pos = spy.sampleTerrainHeight.mock.calls[0][0];
-    expect(pos.lat).toBeCloseTo(rad(TOKYO.lat), 9);
-    expect(pos.lng).toBeCloseTo(rad(TOKYO.lng), 9);
+    expect(pos.lat).toBeCloseTo(TOKYO.lat, 9);
+    expect(pos.lng).toBeCloseTo(TOKYO.lng, 9);
 
     // terrain 300 + requested 10
     expect(lastPlacement()?.height).toBeCloseTo(310, 9);

package/src/core/MeshDesc.ts

@@ -3,7 +3,7 @@ import {
   headingPitchRollToFixedFrame,
   type GeodeticPlacement,
 } from "@navaramap/three-api";
-import { Euler, MathUtils, Matrix4, Object3D, Vector3, type Mesh } from "three";
+import { Euler, Matrix4, Object3D, Vector3, type Mesh } from "three";
 import invariant from "tiny-invariant";
 
 import type ThreeView from "../index";
@@ -369,10 +369,7 @@ export abstract class MeshDesc<
       return;
     }
 
-    const pos = {
-      lat: MathUtils.degToRad(g.lat),
-      lng: MathUtils.degToRad(g.lng),
-    };
+    const pos = { lat: g.lat, lng: g.lng };
     this.terrainHeight = this.view.sampleTerrainHeight(pos) ?? 0;
     this.terrainUnsubscribe = this.view.observeTerrainHeightAt(
       pos,

package/src/evaluations/FeatureEvaluator.ts

@@ -99,6 +99,11 @@ export type { GeometryType };
  * Information about a feature batch, passed to evaluation callbacks.
  */
 export type FeatureInfo = {
+  /**
+   * The feature's canonical global batch id (its first instance's id when a
+   * feature spans several instances, e.g. MultiPoint). Pick events report the
+   * same canonical id, so picks and evaluations correlate through this field.
+   */
   batchId: number;
   properties: Record<string, unknown> | undefined;
   layerId: LayerId | undefined;
@@ -431,7 +436,7 @@ export class FeatureEvaluator {
   ) {
     const evaluate = (info: FeatureInfo, batchIndex: number) => {
       const evaluated = f(info);
-      this.applyEvaluatedValues(batchIndex, info.batchId, evaluated);
+      this.applyEvaluatedValues(batchIndex, evaluated);
     };
 
     if (options?.filters) {
@@ -443,30 +448,32 @@ export class FeatureEvaluator {
 
   private applyEvaluatedValues(
     batchIndex: number,
-    batchId: number,
     evaluated: Partial<EvaluatedValue>,
   ) {
     const obj = this.obj;
 
+    // Sprites apply by batch index: a feature can own several instances
+    // (MultiPoint, points derived from line/polygon vertices), so a
+    // batch-id keyed lookup would style only one of them.
     if (obj instanceof InstancedSpriteMesh) {
       if (evaluated.color != null) {
-        obj.setFeatureColorByBatchId(batchId, evaluated.color.raw);
+        obj.setFeatureColorByBatchIndex(batchIndex, evaluated.color.raw);
       }
       if (evaluated.show != null) {
-        obj.setFeatureShowByBatchId(batchId, evaluated.show);
+        obj.setFeatureShowByBatchIndex(batchIndex, evaluated.show);
       }
       if (evaluated.height != null) {
-        obj.setFeatureHeightByBatchId(batchId, evaluated.height);
+        obj.setFeatureHeightByBatchIndex(batchIndex, evaluated.height);
       }
       if (evaluated.size != null) {
-        obj.setFeatureSizeByBatchId(batchId, evaluated.size);
+        obj.setFeatureSizeByBatchIndex(batchIndex, evaluated.size);
       }
       if (evaluated.opacity != null) {
-        obj.setFeatureOpacityByBatchId(batchId, evaluated.opacity);
+        obj.setFeatureOpacityByBatchIndex(batchIndex, evaluated.opacity);
       }
       if (evaluated.declutterPriority != null) {
-        obj.setFeatureDeclutterPriorityByBatchId(
-          batchId,
+        obj.setFeatureDeclutterPriorityByBatchIndex(
+          batchIndex,
           evaluated.declutterPriority,
         );
       }
@@ -474,7 +481,7 @@ export class FeatureEvaluator {
         // Async by nature (the image may need fetching); the atlas dedupes
         // loads by URL so evaluating many features costs one fetch per image.
         // A nullish url clears the override back to the material default.
-        void obj.setFeatureImageByBatchId(batchId, evaluated.image);
+        void obj.setFeatureImageByBatchIndex(batchIndex, evaluated.image);
       }
       return;
     }

package/src/event/feature.ts

@@ -14,7 +14,7 @@ import {
   PolygonMesh,
   PolylineMesh,
 } from "../mesh";
-import { FEATURE_RENDER_ORDER } from "../renderOrder";
+import { FEATURE_RENDER_ORDER, STROKE_RENDER_ORDER } from "../renderOrder";
 import type { Scenes } from "../scene";
 
 import type { EventContext } from "./context";
@@ -190,7 +190,20 @@ export async function processRenderableFeatureAdded(
     setTransform(obj, transform);
   }
 
-  obj.renderOrder = FEATURE_RENDER_ORDER;
+  // Strokes draw after fills: sibling meshes are created asynchronously in
+  // arbitrary order, and a fill drawn after a coplanar stroke either paints
+  // over it (bake scene) or z-fights against its depth (MRT scene), so the
+  // stacking must come from renderOrder, not insertion order. Only polylines
+  // stroking polygon rings sit on a sibling fill; standalone line strokes
+  // keep the base order — elevated, they would deterministically composite
+  // over every marker and outline they merely cross (PolylineMesh skips the
+  // depth test in the MRT scene).
+  const strokesSiblingFills =
+    polyline?.material.geometryTypes?.includes("polygon") ?? false;
+  obj.renderOrder =
+    obj instanceof PolylineMesh && strokesSiblingFills
+      ? STROKE_RENDER_ORDER
+      : FEATURE_RENDER_ORDER;
 
   // Add to MRT scene if not draped (draped features render to texturized scene)
   const isDraped =

package/src/event/features/billboard.test.ts

@@ -0,0 +1,62 @@
+import type { BillboardMesh as NavaraBillboardMesh } from "@navaramap/engine";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+
+import type { EventContext } from "../context";
+
+import { renderBillboard } from "./billboard";
+
+const init = vi.fn().mockResolvedValue(undefined);
+const setActive = vi.fn();
+
+vi.mock("../../mesh", () => ({
+  InstancedSpriteMesh: class {
+    _init = init;
+    setActive = setActive;
+  },
+}));
+
+describe("renderBillboard", () => {
+  const ctx = {} as EventContext;
+
+  // `url` is omitted from the material entirely when not passed, mirroring the
+  // engine's `string | undefined` accessor. The engine itself currently always
+  // sends a string (`BillboardMaterial::url` is a `String` defaulting to `""`,
+  // converted as `Some(url)`), so `""` is the shape a real url-less layer
+  // produces — both are covered below.
+  const createMesh = (url?: string) =>
+    ({
+      material: url === undefined ? {} : { url },
+      active: true,
+    }) as unknown as NavaraBillboardMesh;
+
+  beforeEach(() => {
+    init.mockClear();
+    setActive.mockClear();
+  });
+
+  it("creates a mesh when the material carries a default image", async () => {
+    const obj = await renderBillboard(ctx, createMesh("marker.png"));
+
+    expect(obj).toBeDefined();
+    expect(init).toHaveBeenCalledOnce();
+  });
+
+  // Regression: the mesh used to be skipped when the material had no `url`,
+  // so a layer that styles every feature through a FeatureEvaluator
+  // (`{ image }`) never got a mesh — and never a `featureCreated` event to
+  // attach the evaluator to. Empty atlas rects keep such instances invisible
+  // until an image is packed, so the mesh is safe to create eagerly.
+  it("creates a mesh when the material's default image is empty", async () => {
+    const obj = await renderBillboard(ctx, createMesh(""));
+
+    expect(obj).toBeDefined();
+    expect(init).toHaveBeenCalledOnce();
+  });
+
+  it("creates a mesh when the material has no `url` at all", async () => {
+    const obj = await renderBillboard(ctx, createMesh());
+
+    expect(obj).toBeDefined();
+    expect(init).toHaveBeenCalledOnce();
+  });
+});

package/src/event/features/billboard.ts

@@ -8,8 +8,10 @@ export async function renderBillboard(
   ctx: EventContext,
   m: NavaraBillboardMesh,
 ) {
-  if (!m.material.url) return;
-
+  // No `url` check: a billboard layer may carry no material-level image and
+  // get every image per-feature from a FeatureEvaluator (`{ image }`). The
+  // mesh starts with empty atlas rects, which the shader culls, so instances
+  // stay invisible until an image is packed for them.
   const mesh = new InstancedSpriteMesh({
     renderOrder: FEATURE_RENDER_ORDER,
     ctx,

package/src/index.ts

@@ -23,7 +23,7 @@ import {
   type FontWorkerMemoryStats,
 } from "@navaramap/font";
 import FontWorkerURL from "@navaramap/font/fontWorker?worker&url";
-import { initNavaraApi } from "@navaramap/three-api";
+import { initNavaraApi, degreeToRadian } from "@navaramap/three-api";
 import {
   initializeWorkerPool,
   probeWorkerPoolHeap,
@@ -309,7 +309,11 @@ export type Options = {
   atmosphere?: AtmosphereOptions;
   /** Background color of the scene. Defaults to dark color (0x0a0a0f). */
   backgroundColor?: CoreColor;
-  /** Feature picking configuration. */
+  /**
+   * Feature picking configuration (default: true). Enables the `featureClick`
+   * event (click) and the `featureHover` / `featureEnter` / `featureLeave`
+   * events (mousemove).
+   */
   picking?: boolean;
   /** When true, renders every frame. When false, renders only on changes or when forceUpdate() is called. */
   animation?: boolean;
@@ -413,8 +417,24 @@ export type MapMouseEvent = {
 export type ViewEvents = {
   /** Emitted when the view is resized. Receives width and height in pixels. */
   resize: (w: number, h: number) => void;
-  /** Emitted when a feature is picked. Receives picked feature info or null. */
-  pick: (info: Nullable<PickedFeature>) => void;
+  /**
+   * Emitted when a feature is clicked (click-gesture GPU pick). Receives the
+   * clicked feature, or null when empty space was clicked. For raw click
+   * coordinates use the `click` event instead.
+   */
+  featureClick: (info: Nullable<PickedFeature>) => void;
+  /**
+   * Emitted when the hovered feature changes (mousemove picking). Receives
+   * the newly hovered feature, or null when the pointer leaves all pickable
+   * features. Hover picking runs a GPU pick per frame while the pointer
+   * moves, and is active only while at least one `featureHover` /
+   * `featureEnter` / `featureLeave` listener is registered.
+   */
+  featureHover: (info: Nullable<PickedFeature>) => void;
+  /** Emitted when the pointer starts hovering a pickable feature. See `featureHover` for activation. */
+  featureEnter: (info: PickedFeature) => void;
+  /** Emitted when the pointer stops hovering the previously hovered feature. See `featureHover` for activation. */
+  featureLeave: (info: PickedFeature) => void;
   /** Emitted when a layer event occurs. Receives event type, layer ID, and event arguments. */
   layer: <K extends keyof LayerEvent>(
     k: K,
@@ -503,6 +523,9 @@ export default class ThreeView<
    *  `camera_flight_ended` events from the engine. */
   private _pendingFlights = new Map<number, (completed: boolean) => void>();
 
+  /** Currently hovered feature, used to diff-synthesize hover events. */
+  private _hoveredFeature: Nullable<PickedFeature> = null;
+
   private _meshes: MeshCache = new Map();
   private _abortControllers: AbortControllers = new Map();
   private _workerPoolPromises: WorkerPoolPromises = new Map();
@@ -1562,6 +1585,17 @@ export default class ThreeView<
         this._camera.raw,
         this._meshes,
         this.onPick.bind(this),
+        this.onHoverPick.bind(this),
+        // Picks cost a GPU render (plus a re-render to restore draped
+        // atlases), so both gestures stay off until someone actually
+        // listens for the result.
+        () => !!this.size("featureClick"),
+        () =>
+          !!(
+            this.size("featureHover") ||
+            this.size("featureEnter") ||
+            this.size("featureLeave")
+          ),
         // {
         //   debug: true,
         // },
@@ -2621,11 +2655,11 @@ export default class ThreeView<
 
   /**
    * Samples the terrain height at a given geodetic position synchronously.
-   * @param pos - Geodetic position (lat in radians, lng in radians)
+   * @param pos - Geodetic position (lat in degrees, lng in degrees)
    * @returns Terrain height in meters, or undefined if terrain data not loaded
    */
   sampleTerrainHeight(pos: LatLng): number | undefined {
-    const lle = new LLE(pos.lat, pos.lng, 0);
+    const lle = new LLE(degreeToRadian(pos.lat), degreeToRadian(pos.lng), 0);
     return this._core?.sampleTerrainHeight(lle);
   }
 
@@ -2643,7 +2677,7 @@ export default class ThreeView<
    * sampled.
    *
    * @param source - A registered terrain source (handle or id)
-   * @param positions - Geodetic positions (lat/lng in radians)
+   * @param positions - Geodetic positions (lat/lng in degrees)
    * @param options - Optional abort signal and fixed-level sampling
    * @returns One result per input position, in the same order
    */
@@ -2669,7 +2703,7 @@ export default class ThreeView<
 
   /**
    * Observes terrain height changes at a position. Callback is invoked each time terrain data updates.
-   * @param pos - Geodetic position to observe (lat in radians, lng in radians)
+   * @param pos - Geodetic position to observe (lat in degrees, lng in degrees)
    * @param cb - Callback function receiving the terrain height in meters
    * @returns Cleanup function to stop observing
    */
@@ -2681,7 +2715,7 @@ export default class ThreeView<
       return () => {};
     }
 
-    const lle = new LLE(pos.lat, pos.lng, 0);
+    const lle = new LLE(degreeToRadian(pos.lat), degreeToRadian(pos.lng), 0);
     const entityBits = this._core.registerSampleTerrainHeightEvent(lle);
 
     const callFunc = (ev: TerrainHeightUpdatedEvent) => {
@@ -2778,6 +2812,29 @@ export default class ThreeView<
     this.resize(width, height, pixelRatio);
   };
 
+  /**
+   * Resolves a picked batch ID into feature information via the engine's
+   * property store.
+   */
+  private resolvePickedFeature(batchId: number): PickedFeature {
+    const prop = this._core?.readPropertyByGlobalBatchId(batchId);
+    if (prop) {
+      return {
+        properties: prop.properties,
+        // The GPU pick returns the clicked instance's id; report the
+        // feature's canonical batch id instead so it matches the id the
+        // evaluator exposes (a MultiPoint feature spans many instances).
+        batchId: prop.batchId ?? batchId,
+        layerId: prop.layerId,
+      };
+    }
+    return {
+      properties: {},
+      batchId,
+      layerId: undefined,
+    };
+  }
+
   /**
    * Handles pick events and emits the picked feature information.
    * @param pickArr - Array of picked batch IDs
@@ -2786,28 +2843,34 @@ export default class ThreeView<
     this._renderFlag.forceUpdate = true;
 
     if (pickArr.length > 0) {
-      const batchId = pickArr[0];
-      const prop = this._core?.readPropertyByGlobalBatchId(batchId);
-      if (prop) {
-        const pickedFeature: PickedFeature = {
-          properties: prop.properties,
-          batchId,
-          layerId: prop.layerId,
-        };
-        this.emit("pick", pickedFeature);
-      } else {
-        const emptyFeature: PickedFeature = {
-          properties: {},
-          batchId,
-          layerId: undefined,
-        };
-        this.emit("pick", emptyFeature);
-      }
+      this.emit("featureClick", this.resolvePickedFeature(pickArr[0]));
     } else {
-      this.emit("pick", null);
+      this.emit("featureClick", null);
     }
   }
 
+  /**
+   * Handles hover pick results and synthesizes `featureHover` / `featureEnter` /
+   * `featureLeave` events by diffing against the previously hovered feature.
+   * @param pickArr - Array of picked batch IDs
+   */
+  private onHoverPick(pickArr: number[]) {
+    // The pick render re-bakes draped vector atlases in pick mode; a main
+    // render is needed to restore their normal colors.
+    this._renderFlag.forceUpdate = true;
+
+    const batchId = pickArr.length > 0 ? pickArr[0] : 0;
+    const prev = this._hoveredFeature;
+    if ((prev?.batchId ?? 0) === batchId) return;
+
+    const feature = batchId > 0 ? this.resolvePickedFeature(batchId) : null;
+    this._hoveredFeature = feature;
+
+    if (prev) this.emit("featureLeave", prev);
+    if (feature) this.emit("featureEnter", feature);
+    this.emit("featureHover", feature);
+  }
+
   /**
    * Gets whether continuous animation mode is enabled.
    */
@@ -2821,6 +2884,14 @@ export default class ThreeView<
     this._renderFlag.animation = v;
   }
 
+  /**
+   * Gets the canvas element the view renders into. Useful for styling,
+   * e.g. switching the cursor from a `featureHover` event listener.
+   */
+  get canvas(): HTMLCanvasElement {
+    return this._renderer.domElement;
+  }
+
   /**
    * Gets the current screen size in pixels.
    */

package/src/material/macro/tileShader.ts

@@ -97,8 +97,18 @@ export function generateTileMapFragment(
   }`
     : "";
   return `
-  vec4 atlasColor = texture2D(uColorAtlas, vOrigUv);
-  vec4 atlasAttr  = texture2D(uAttrAtlas,  vOrigUv);
+  // The atlases are linear-filtered for display, but the pick pass reads
+  // encoded batch ids out of atlasColor: interpolating id colors at feature
+  // edges decodes to batch ids that don't exist (a thin draped polyline is
+  // almost all edge pixels). Snap to the texel center (nearest sampling)
+  // while picking.
+  vec2 nvr_atlasUv = vOrigUv;
+  if (uPickable > 0.) {
+    vec2 nvr_atlasSize = vec2(textureSize(uColorAtlas, 0));
+    nvr_atlasUv = (floor(vOrigUv * nvr_atlasSize) + 0.5) / nvr_atlasSize;
+  }
+  vec4 atlasColor = texture2D(uColorAtlas, nvr_atlasUv);
+  vec4 atlasAttr  = texture2D(uAttrAtlas,  nvr_atlasUv);
 
   // attr.a encodes (winningSlot + 1) / 255 — 0 means no contributing slot.
   int winIdx = int(round(atlasAttr.a * 255.0)) - 1;

package/src/mesh/polyline.ts

@@ -32,6 +32,16 @@ import { setupRTECallback } from "./rtcRteHelper";
 // Sentinel value for picking coordinate when not picking (reused to avoid allocations)
 const PICKING_COORD_SENTINEL = new Vector2(-1, -1);
 
+/**
+ * Minimum stroke width used while rendering the pick pass. A hairline stroke
+ * covers too few pick-buffer texels to click reliably — on the draped path the
+ * 512px tile atlas resolves a thin line to scattered partial texels, so the
+ * decoded batch id is background almost everywhere the line is visible.
+ * Fattening the stroke only for the pick render gives lines the same "click
+ * tolerance" pointing devices get elsewhere; the visible width is untouched.
+ */
+const MIN_PICK_WIDTH = 10;
+
 type Attributes = BatchedFeatureAttributes<{
   position: BufferAttribute;
   // RTE mode attributes (only present when useRTE=true)
@@ -490,11 +500,21 @@ export class PolylineMesh extends BatchedFeatureMesh<
     return this.getEnhancer().states().effectIdsMask;
   }
 
+  /** Visible stroke width to restore after a pick-pass width bump. */
+  private _pickSavedWidth?: number;
+
   onBeforePicking(pickingCoord?: Vector2) {
-    this.getEnhancer().update({ base: { pickable: true } });
+    const enhancer = this.getEnhancer();
+    const width = enhancer.states().width;
+    if (width < MIN_PICK_WIDTH) {
+      this._pickSavedWidth = width;
+      enhancer.update({ base: { pickable: true, width: MIN_PICK_WIDTH } });
+    } else {
+      enhancer.update({ base: { pickable: true } });
+    }
     this.needsUpdate();
 
-    const mutates = this.getEnhancer().mutates();
+    const mutates = enhancer.mutates();
     if (pickingCoord) {
       mutates.setPickingCoord(pickingCoord);
     } else {
@@ -503,9 +523,17 @@ export class PolylineMesh extends BatchedFeatureMesh<
   }
 
   onAfterPicking() {
-    this.getEnhancer().update({ base: { pickable: false } });
+    const enhancer = this.getEnhancer();
+    if (this._pickSavedWidth !== undefined) {
+      enhancer.update({
+        base: { pickable: false, width: this._pickSavedWidth },
+      });
+      this._pickSavedWidth = undefined;
+    } else {
+      enhancer.update({ base: { pickable: false } });
+    }
     this.needsUpdate();
-    this.getEnhancer().mutates().setPickingCoord(PICKING_COORD_SENTINEL);
+    enhancer.mutates().setPickingCoord(PICKING_COORD_SENTINEL);
   }
 
   _getDefaultBatchAttributeValues(): DefaultBatchAttributeValues {

package/src/mesh/sdfText/batchedSdfText.test.ts

@@ -212,6 +212,71 @@ describe("BatchedSdfTextMesh material updates vs per-feature values", () => {
   });
 });
 
+// A feature owns several anchors for MultiPoint geometry and for labels
+// derived from line/polygon vertices via `geometryTypes`. Per-feature setters
+// address features (batch indices), so they must fan out to every anchor the
+// feature owns via the geometry's per-anchor `batch_index` buffer.
+describe("BatchedSdfTextMesh multi-instance fan-out", () => {
+  /** Feature 0 owns anchors 0 and 1 (MultiPoint); feature 1 owns anchor 2. */
+  function multiInstanceMeshEvent(mat: NavaraTextMaterial): NavaraTextMesh {
+    return {
+      material: mat,
+      transform: { tx: 0, ty: 0, tz: 0 },
+      geometry: {
+        batch_ids: { data: new Float32Array([7, 8, 9]), size: 1 },
+        batch_index: { data: new Uint32Array([0, 0, 1]), size: 1 },
+        position: {
+          data: new Float32Array([0, 0, 0, 10, 0, 0, 20, 0, 0]),
+          size: 3,
+        },
+      },
+    } as unknown as NavaraTextMesh;
+  }
+
+  function makeMultiInstanceMesh() {
+    const fontManager = makeFontManager();
+    const ctx = {
+      buf: {
+        removeF32: (d: Float32Array) => d,
+        u32: (d: Uint32Array) => d,
+      },
+      fontManager,
+      renderFlag: { forceUpdate: false },
+    } as unknown as EventContext;
+    const mesh = new BatchedSdfTextMesh(
+      ctx,
+      multiInstanceMeshEvent(material()),
+      "font",
+      { layerId: "layer" },
+    );
+    return { mesh, fontManager };
+  }
+
+  it("applies text and styles to every anchor the feature owns", () => {
+    const { mesh } = makeMultiInstanceMesh();
+    mesh.setTextByBatchIndex(0, "AB");
+    mesh.setFeatureSizeByBatchIndex(0, 32);
+
+    // Feature 0's two anchors got labels (slots 0 and 1), both styled.
+    expect(showOf(mesh, 0)).toBe(1);
+    expect(showOf(mesh, 1)).toBe(1);
+    expect(sizeOf(mesh, 0)).toBe(32);
+    expect(sizeOf(mesh, 1)).toBe(32);
+  });
+
+  it("does not leak styling into other features' anchors", () => {
+    const { mesh } = makeMultiInstanceMesh();
+    mesh.setTextByBatchIndex(0, "AB");
+    mesh.setTextByBatchIndex(1, "CD");
+    mesh.setFeatureShowByBatchIndex(1, false);
+
+    expect(showOf(mesh, 0)).toBe(1);
+    expect(showOf(mesh, 1)).toBe(1);
+    // Feature 1 = anchor 2 = the third label slot.
+    expect(showOf(mesh, 2)).toBe(0);
+  });
+});
+
 // Unprepared text costs a worker round-trip and font-face fetches, and a
 // low-zoom tile spans far more world than the screen shows. With declutter on,
 // `setTextByBatchIndex` therefore parks preparation until a placement pass