Javascript 使用D3在饼图中添加数据

我有一个使用d3的应用程序

import React，{useState}来自“React”；
从“react dom”导入react dom；
从“d3”导入*作为d3；
从“/PieGraph”导入饼图；
导入“/styles.css”；
函数App（）{
const[data，setData]=useState([
{
价值：25
},
{
价值：59
},
{
价值：77
}
]);
返回(
带有React和D3的饼图
);
}
const rootElement=document.getElementById（“根”）；
render（，rootElement）

假设您可以自己更改

PieGraph.js

，我将执行以下操作：

更改

Arc

以接受带有

值和
标签的数据

piegraph.js

const Arc=（{data，index，createArc，colors，format}）=>(
//找零
{data.format！==未定义？data.format:format（data.value）}
);

更改传递到

饼图的数据

index.js

const[data，setData]=useState([
{
价值：25，
标签：“25个苹果”，
},
{
价值：59，
标签：“”，
},
{
价值：77
}
]);

---

现在，第一个有“25个苹果”的标签，第二个没有标签，第三个有标签

77.00

，就像以前一样。

如果是您自己写的，请显示

PieGraph

的代码。