为多个数据集配置 chartJS 解析

Question

我正在尝试使用 chartJS 在图表上为我的每个数据集绘制多条线。数据以特定格式出现，我似乎无法计算出让图表将数据值正确映射到它们的轴以绘制图形的语法。这是我的数据：

const allData = [{
  "data": {
    
    "shortUrl": "http://[DOMAIN]/[URL1]",
    "clicksByDate": [
      {
        "date": "3/21",
        "count": 1,
      },
      {
        "date": "3/22",
        "count": 3,
      },
      {
        "date": "3/23",
        "count": 2,
      }
    ]
  },
  { ... }
}]

在这种格式中，我想将每个

shortUrl

绘制成一条单独的线，其中 X 轴代表 URL 发生的点击次数

date

，Y 轴代表该日期的点击次数

count

。

我能理解的最接近的是：

new Chart(document.getElementById("stat-chart"), {
  type: "line",
  options: {
    
    parsing: {
      xAxisKey: "clicksByDate.date",
      yAxisKey: "clicksByDate.count",
    },
  },
  data: {
    labels: allData[0].data.clicksByDate.map((row) => row.date), //know this is wrong, but not sure how to make sure all dates from both sets are represented
    datasets: allData,
  },
});

但它只是绘制轴并没有映射数据。没有错误被抛出。