在 chart.js 中从已解析的 csv 向每一列添加不同的点样式

Question

我正在尝试使用解析后的 csv 为每个列数据集指定 pointStyle 颜色。现在，这将导致折线图上的点颜色交替。将 'borderColor:' 拆分成三个 if 语句“i 等于列号”有效吗？不知道怎么写。

var data = Papa.parse(csvString).data;
    var timeLabels = data.slice(1).map(function(row) { return row[0]; }); // data in that column

    var datasets = [];
    for (var i = 1; i < data[0].length; i++) {
      datasets.push(
        {
          label: data[0][i], // column name
          data: data.slice(1).map(function(row) {return row[i]}), // data in that column
          fill: false, // `true` for area charts, `false` for regular line charts
          borderColor: ["#3e95cd","#8e5ea2","#c45850"],
          borderWidth: "2",
          pointRadius: '0',
          pointStyle: "rectRot"
        }
      )
    }

Answer 1

你现在告诉每个数据集它必须使用的颜色是一个包含 3 种颜色的数组，所以它会这样做，就像你说的，如果你只想要一种颜色，你只需要像这样传递一种颜色：

var datasets = [];
const colors = ["#3e95cd", "#8e5ea2", "#c45850"];

for (var i = 1; i < data[0].length; i++) {
  datasets.push({
    label: data[0][i], // column name
    data: data.slice(1).map(function(row) {
      return row[i]
    }), // data in that column
    fill: false, // `true` for area charts, `false` for regular line charts
    borderColor: colors[i],
    borderWidth: "2",
    pointRadius: '0',
    pointStyle: "rectRot"
  })
}

在 chart.js 中从已解析的 csv 向每一列添加不同的点样式

Adding different point style to each column from parsed csv in chart.js

javascript

papaparse

chart.js