Text Layer not rendering and calling get functions

Question

I have the following text layer.

  const text = new TextLayer({
    id:'text-layer',
    data: data,
    getPosition: [-37.840935,144.946457],
    pickable: true,
    getText: d => "test",
    getSize: d => 30,
    getAngle: 0,
    sizeScale: 1,
    getTextAnchor: 'middle',
    getAlignmentBaseline: 'center',
  })

I have imported the text layer.

import {GeoJsonLayer, TextLayer} from '@deck.gl/layers';

I set the layer as follows:

    <DeckGL
      layers={[geoLayer, text]}

My GeoJSON layer functions smoothly without any issues. However, when I attempt to add a text layer or use a text layer independently, I encounter difficulties. Specifically, I find that the getText and getSize functions are not rendering or being called when I inspect the code for debugging.

The system disregards the text layer, and there are no console errors. When I attempt to use getText, it appears unresponsive, unlike the geo layer where I receive the expected output when I use console.log.

Any ideas what I'm missing here?

Answer 1

It is better when you ask something if you generate a CodePen/CodeSandbox

Anyway, getPosition is an accessor that needs to point to your coordinates, i.e:

getPosition: (row) => row.geometry.coordinates

See full example here