0

当我尝试使用 react-native-svg-charts 将文本添加到饼图的中心时，文本会出现两次。图片和代码附在下面。有人可以帮我吗？谢谢。

截图： 在此处输入图片描述

代码：

const red = "#d83c3c";
const gray = "#eaebeb";
const data = [2, 3];
const colors = [gray, red];
const pieData = data
  .filter((value) => value > 0)
  .map((value, index) => ({
    value,
    svg: {
      fill: colors[index],
    },
    key: `pie-${index}`,
  }));

export default function Dashboard() {
  return (
    <ScrollView style={styles.background}>
      {/* <StackedBarChart
        style={{ height: 200, height: 15, marginTop: 10, marginBottom: 10 }}
        keys={stacked_bar_keys}
        colors={stacked_bar_colors}
        data={stacked_bar_data}
        horizontal={true}
        showGrid={false}
        contentInset={{ top: 30, bottom: 30 }}
      /> */}
      <PieChart
        style={{ height: 200 }}
        innerRadius={"80%"}
        data={pieData}
      >
        <Text
          style={{
            top: 100,
          }}
        >
          Poor Health
        </Text>
      </PieChart>
</ScrollView>
  );
}

const styles = StyleSheet.create({
  background: {
    paddingTop: 8,
    paddingBottom: 8,
    flex: 1,
    // backgroundColor: "white",
  },
});
4

0 回答 0