Javascript ReactJs中的ApexCharts条形图垂直类别逻辑？

我在尝试找出如何将正确的数据显示到正确的类别时遇到问题。 我的数据是来自json API的以下格式：

{
  "name" : "product1",
  "records": "5",
  "month" : "Jan",
},
{
  "name" : "product1",
  "records": "10",
  "month" : "Feb",
},
{
  "name" : "product1",
  "records": "20",
  "month" : "March",
},
{
  "name" : "product2",
  "records": "5",
  "month" : "Feb",
}

数据模型的一个示例

this.state = {
  barChart: { 
   options: {
      plotOptions: {
        xaxis: {
          categories: []
       }}}
        series: [{name: [], data: []}}

这是来自apexcharts的ReactJs中的状态 我已经花了几天时间，我试着根据字母表对它进行排序：图表中显示的数据是错误的。 我正在阅读文档，但没有弄清楚如何做，或者如何正确地理解逻辑。类别不能重复：[1月、2月、3月]

---

并且数据[记录]必须在它自己的类别中是正确的。

以下代码将为每个产品创建一个系列对象。每个产品都有自己的数据阵列。其中每个数字依次对应于一个月。为该产品的数据集中未使用的月份添加0值

示例数据集： 这将创建数据集中使用的月份数组。没有重复的。我们将使用它来映射每个产品在其特定月份的相应数据值

创建类别： 创建系列： 然后，只需使用新的系列数据和类别更新属性

this.state = {
  barChart: { 
   options: {
      plotOptions: {
        xaxis: {
          categories: [...months]
       }}}
        series: [...series]}

---

以下代码将为每个产品创建一个系列对象。每个产品都有自己的数据阵列。其中每个数字依次对应于一个月。为该产品的数据集中未使用的月份添加0值

示例数据集： 这将创建数据集中使用的月份数组。没有重复的。我们将使用它来映射每个产品在其特定月份的相应数据值

创建类别： 创建系列： 然后，只需使用新的系列数据和类别更新属性

this.state = {
  barChart: { 
   options: {
      plotOptions: {
        xaxis: {
          categories: [...months]
       }}}
        series: [...series]}

---

---

那么x轴和y轴的类别是什么？您正在尝试创建时间序列吗？我的x轴的类别是月份名称，y轴是系列：[数据]记录数。是的，我是，图表的逻辑来自基本的条形图[apexcharts]明白了，所以你是否考虑创建一个类似堆叠条形图或折线图的东西，其中每条线都是自己的产品？看起来您需要多个系列对象。@ChristophenGo只是一个基本的，一个堆叠的条形图，如下所示：，我确实有多个系列对象。。正如您从json模型中看到的，有两种产品，但其中一种有[jan，feb，march]的数据，而另一种只有[feb]的数据。@Christophengo感谢您，谢谢您的x轴和y轴的类别是什么？您正在尝试创建时间序列吗？我的x轴的类别是月份名称，y轴是系列：[数据]记录数。是的，我是，图表的逻辑来自基本的条形图[apexcharts]明白了，所以你是否考虑创建一个类似堆叠条形图或折线图的东西，其中每条线都是自己的产品？看起来您需要多个系列对象。@ChristophenGo只是一个基本的，一个堆叠的条形图，如下所示：，我确实有多个系列对象。。正如您从json模型中看到的，有两种产品，但其中一种有[jan，feb，march]的数据，另一种只是[feb]的数据。@Christophengo感谢您是一位传奇人物，工作得非常好。如果将来有任何问题，我会让你知道。@Michael谢谢：）！这是一个很大的问题，所以我很乐意帮忙！嗨@Christopher，我还在用图形和数据网格进行项目，我正在试图解决一个问题。。问你几个问题最好的联系方式是什么？嗨@Michael，太棒了，我希望项目进展顺利。如果您愿意，可以通过电子邮件与我联系：ChristopherNgo94@gmail.com问我你的问题，我看看我是否能帮忙：）嗨，克里斯托弗，我给你发了一封电子邮件。谢谢你是个传奇人物，工作得很好。如果将来有任何问题，我会让你知道。@Michael谢谢：）！这是一个很大的问题，所以我很乐意帮忙！嗨@Christopher，我还在用图形和数据网格进行项目，我正在试图解决一个问题。。问你几个问题最好的联系方式是什么？嗨@Michael，太棒了，我希望项目进展顺利。如果您愿意，可以通过电子邮件与我联系：ChristopherNgo94@gmail.com问我你的问题，我看看我是否能帮忙：）嗨，克里斯托弗，我给你发了一封电子邮件。谢谢

const productTotals = data.reduce((obj, curr) => {
    if(!obj[curr.name]){
        obj[curr.name] = []
    }

    obj[curr.name][months.indexOf(curr.month)] = parseInt(curr.records)
    return obj
}, {})

const series = Object.entries(productTotals).map(([name, prodArr]) => {
    return {
        name: name,
        data: months.map((month, monthIndex) => {
            if(!prodArr[monthIndex]){
                return 0
            } else {
                return prodArr[monthIndex]
            }

        })
    }

})

this.state = {
  barChart: { 
   options: {
      plotOptions: {
        xaxis: {
          categories: [...months]
       }}}
        series: [...series]}