How to add text on drawn shape using react-native-art?

Question

I am drawing a pie chart using react-native-art. I want to add the text on each shape (or an arc of pie chart). Is there any way through which I can achieve this.

Answer 1

The only way to add text inside a shape at the moment is to use Text component provided by react-native-art. It is not Text component of react-native, btw.

Positioning the text requires using of Group, another component of react-native-art.

A general example:

import { Surface, Group, Text } from 'react-native/Libraries/ART/ReactNativeART'

...
return (
  <Surface>
    <Group x={xCoord} y={yCoord}>
      <Text
        font={`13px "Helvetica Neue", "Helvetica", Arial`}
        fill = "#000000"
        alignment = "center"
      >
        Hello World
      </Text>
    </Group>
  </Surface>
)
...

EDIT: If you want to find more, please look at the temporary doc for ART library: https://github.com/react-native-china/react-native-ART-doc/blob/master/doc.md