TextLayer is not rendering anything, what am I doing wrong?

[neelduttahere]

Below is my code snippet

 <TextLayer
          id={`${activeInsight.metadata.block_name}-${activeInsight.id}-text-overlay`}
          data={VectorFeatures}
          //   characterSet="auto"
          // fontSettings={{
          //   buffer: 8,
          // }}
          getText={(d) => d.name}
          getPosition={(d) => d.coordinates}
          //   getSize={32}
          //   sizeUnits={"pixels"}
          //   sizeMaxPixels={sizeMaxPixels}
          //   sizeMinPixels={sizeMinPixels}
          getColor={[0, 0, 0, 255]}
          sizeScale={fontSize}
          pickable={true}
          //   maxWidth={64 * 12}
          //   collisionEnabled={true}
          //   //   // getCollisionPriority={d => Math.log10("factor in your geojson that prioritizes a feature over others")}
          //   collisionTestProps={{
          //     sizeScale: fontSize * 2,
          //     sizeMaxPixels: sizeMaxPixels * 2,
          //     sizeMinPixels: sizeMinPixels * 2,
          //   }}
          //   extensions={[new CollisionFilterExtension()]}
        />

VectorFeatures is an array of length 10. If I console log in getPosition it returns the array item, which means layer is taking the input, but I am finding it hard to understand why is it not rendering. I took reference from the example posted in the documentation for TextLayer. What am I doing wrong?

[Pessimistress]

It will help if you share a sample of your data.

[neelduttahere]

[
    {
        "coordinates": [
            -102.366428948401,
            34.2322768589003
        ],
        "text": "1008.3121451953374"
    },
    {
        "coordinates": [
            -102.4309493485421,
            34.21518781595936
        ],
        "text": "1008.4445724628845"
    },
    {
        "coordinates": [
            -102.38418876540288,
            34.213487435894095
        ],
        "text": "1008.515853740825"
    },
    {
        "coordinates": [
            -102.46434483403918,
            34.2699349053746
        ],
        "text": "1018.9647142570079"
    },
    {
        "coordinates": [
            -102.45078850901328,
            34.24387569668994
        ],
        "text": "1019.2862494130579"
    },
    {
        "coordinates": [
            -102.4018486952551,
            34.2477091280004
        ],
        "text": "1019.2945481774336"
    },
    {
        "coordinates": [
            -102.43633594987452,
            34.20378715245974
        ],
        "text": "1019.7794213982012"
    },
    {
        "coordinates": [
            -102.39052480235246,
            34.26118765436368
        ],
        "text": "1030.3457767042323"
    },
    {
        "coordinates": [
            -102.38035246840406,
            34.18726262624371
        ],
        "text": "1042.4566609179265"
    },
    {
        "coordinates": [
            -102.41911104666943,
            34.24536574000623
        ],
        "text": "1052.9059682488341"
    }
]

[Pessimistress]

Your getText returns d.ñame which does not exist?

[neelduttahere]

Wow. This is embarrassing. Thanks a lot for reverting back!