improved type for picking info (#50)

Author: kylebarron

src/path-layer.ts

@@ -165,11 +165,13 @@ export class GeoArrowPathLayer<
     const offsets: number[] = table._offsets;
     const currentBatchOffset = offsets[recordBatchIdx];
 
-    info.object = row;
     // Update index to be _global_ index, not within the specific record batch
     index += currentBatchOffset;
-    info.index = index;
-    return info;
+    return {
+      ...info,
+      index,
+      object: row,
+    };
   }
 
   renderLayers(): Layer<{}> | LayersList | null {

src/scatterplot-layer.ts

@@ -26,7 +26,7 @@ import {
   validatePointType,
   validateVectorAccessors,
 } from "./utils.js";
-import { MultiPointVector, PointVector } from "./types.js";
+import { GeoArrowPickingInfo, MultiPointVector, PointVector } from "./types.js";
 import { EXTENSION_NAME } from "./constants.js";
 
 const DEFAULT_COLOR: [number, number, number, number] = [0, 0, 0, 255];
@@ -171,7 +171,10 @@ export class GeoArrowScatterplotLayer<
   static defaultProps = defaultProps;
   static layerName = "GeoArrowScatterplotLayer";
 
-  getPickingInfo({ info, sourceLayer }: GetPickingInfoParams): PickingInfo {
+  getPickingInfo({
+    info,
+    sourceLayer,
+  }: GetPickingInfoParams): GeoArrowPickingInfo {
     const { data: table } = this.props;
 
     // Geometry index as rendered
@@ -195,11 +198,13 @@ export class GeoArrowScatterplotLayer<
     const offsets: number[] = table._offsets;
     const currentBatchOffset = offsets[recordBatchIdx];
 
-    info.object = row;
     // Update index to be _global_ index, not within the specific record batch
     index += currentBatchOffset;
-    info.index = index;
-    return info;
+    return {
+      ...info,
+      index,
+      object: row,
+    };
   }
 
   renderLayers(): Layer<{}> | LayersList | null {

src/solid-polygon-layer.ts

@@ -30,7 +30,11 @@ import {
   validatePolygonType,
   validateVectorAccessors,
 } from "./utils.js";
-import { MultiPolygonVector, PolygonVector } from "./types.js";
+import {
+  GeoArrowPickingInfo,
+  MultiPolygonVector,
+  PolygonVector,
+} from "./types.js";
 import { EXTENSION_NAME } from "./constants.js";
 
 const DEFAULT_COLOR: [number, number, number, number] = [0, 0, 0, 255];
@@ -142,7 +146,10 @@ export class GeoArrowSolidPolygonLayer<
   static defaultProps = defaultProps;
   static layerName = "GeoArrowSolidPolygonLayer";
 
-  getPickingInfo({ info, sourceLayer }: GetPickingInfoParams): PickingInfo {
+  getPickingInfo({
+    info,
+    sourceLayer,
+  }: GetPickingInfoParams): GeoArrowPickingInfo {
     const { data: table } = this.props;
 
     // Geometry index as rendered
@@ -166,11 +173,13 @@ export class GeoArrowSolidPolygonLayer<
     const offsets: number[] = table._offsets;
     const currentBatchOffset = offsets[recordBatchIdx];
 
-    info.object = row;
     // Update index to be _global_ index, not within the specific record batch
     index += currentBatchOffset;
-    info.index = index;
-    return info;
+    return {
+      ...info,
+      index,
+      object: row,
+    };
   }
 
   renderLayers(): Layer<{}> | LayersList | null {
@@ -390,10 +399,19 @@ export class GeoArrowSolidPolygonLayer<
           startIndices: resolvedPolygonToCoordOffsets,
           attributes: {
             getPolygon: { value: flatCoordinateArray, size: nDim },
+            instancePickingColors: {
+              value: encodePickingColors(
+                resolvedMultiPolygonToCoordOffsets,
+                this.encodePickingColor
+              ),
+              size: 3,
+            },
           },
         },
       };
 
+      console.log(resolvedMultiPolygonToCoordOffsets);
+
       assignAccessor({
         props,
         propName: "getElevation",
@@ -423,3 +441,29 @@ export class GeoArrowSolidPolygonLayer<
     return layers;
   }
 }
+
+function encodePickingColors(
+  geomToCoordOffsets: Int32Array,
+  encodePickingColor: (id: number, result: number[]) => void
+): Uint8ClampedArray {
+  const largestOffset = geomToCoordOffsets[geomToCoordOffsets.length - 1];
+  const pickingColors = new Uint8ClampedArray(largestOffset);
+
+  const pickingColor = [];
+  for (let arrayIdx = 0; arrayIdx < geomToCoordOffsets.length - 1; arrayIdx++) {
+    const thisOffset = geomToCoordOffsets[arrayIdx];
+    const nextOffset = geomToCoordOffsets[arrayIdx + 1];
+
+    // Note: we encode the picking color once per _feature_, but then assign it
+    // to the color array once per _vertex_
+    encodePickingColor(arrayIdx, pickingColor);
+    for (let offset = thisOffset; offset < nextOffset; offset++) {
+      pickingColors[offset * 3] = pickingColor[0];
+      pickingColors[offset * 3 + 1] = pickingColor[1];
+      pickingColors[offset * 3 + 2] = pickingColor[2];
+    }
+  }
+
+  console.log(pickingColors);
+  return pickingColors;
+}

src/types.ts

@@ -1,6 +1,7 @@
+import { PickingInfo } from "@deck.gl/core/typed";
 import * as arrow from "apache-arrow";
 
-export type InterleavedCoord = arrow.FixedSizeList<arrow.Float>;
+export type InterleavedCoord = arrow.FixedSizeList<arrow.Float64>;
 export type SeparatedCoord = arrow.Struct<{
   x: arrow.Float;
   y: arrow.Float;
@@ -27,3 +28,7 @@ export type PolygonData = arrow.Data<Polygon>;
 export type MultiPointData = arrow.Data<MultiPoint>;
 export type MultiLineStringData = arrow.Data<MultiLineString>;
 export type MultiPolygonData = arrow.Data<MultiPolygon>;
+
+export type GeoArrowPickingInfo = PickingInfo & {
+  object: arrow.StructRowProxy
+}