Почему не выводится значение переменной в Pie (charts.js) на Реакте?
У меня есть 3 диаграммы, из которых одна (Pie) не работает;
Я получаю данные из https://dummyjson.com/posts
. Мне нужно вывести <Pie/>
сумма всех лайков и дизлайков.
Я создал переменную likeSum
, и с помощью reduce
суммировал все значения лайков, в console.log(likesSum)
выводится итоговая сумма, но при вставке в data
внутри <Pie/>
почему-то круговая диаграмма не появляется.
const filteredData = data.filter((post) => {
return post.reactions;
});
let likesSum = filteredData.reduce((acc, data) => {
return acc + data.reactions.likes;
}, 0);
let dislikesSum = filteredData.reduce((acc, data) => {
return acc + data.reactions.dislikes;
}, 0);
<div className="dataCard pieCard">
<Pie
data={{
labels: filteredData.map((data) => data.id),
datasets: [
{
label: "likes sum",
// data: filteredData.map((data) => data.reactions.likes),
data: likesSum,
},
{
label: "dislikes sum",
// data: filteredData.map((data) => data.reactions.dislikes),
data: dislikesSum,
},
{
label: "views",
data: filteredData.map((data) => data.reactions.views),
},
],
}}
/>
</div>
Картинка, где видно что нет диаграммы круговой: