如何制作具有不等间距x值的折线图

Question

用 vue-chartjs 制作散点图

<Scatter>

非常完美：

现在用户要求提供相同的图表，但点已连接。所以我尝试将

<Scatter>

更改为

<Line>

。但结果，使用相同的数据描述不起作用：

似乎描述为

{x, y}

的数据不适用于线，而是需要通常的

labels

加上

data

作为值数组。 数据如下：

const data = {
  "datasets": [
    {
      "label": "Diffraction",
      "borderColor": "#f87979",
      "backgroundColor": "#f87979",
      "data": [
        {
          "x": 28.46772426,
          "y": 100
        },
        {
          "x": 47.34657519,
          "y": 66.64746966
        },
        {
          "x": 56.17571327,
          "y": 39.58448396
        },
        {
          "x": 69.19895076,
          "y": 10.71251618
        },
        {
          "x": 76.45494946,
          "y": 16.34081066
        },
        {
          "x": 88.1268895,
          "y": 23.50766372
        }
      ]
    }
  ]
}

有什么方法可以制作由线连接的点的散点图吗？我在某个地方看到提到过

showLine

，但我不知道它是否存在以及应该去哪里。 感谢您的帮助！

Answer 1

datasets: [
  {
    label: "Diffraction",
    borderColor: "#f87979",
    backgroundColor: "#f87979",
    showLine: true, // Enable lines between points
    data: [...]
  }
]