Question

我正在将chart.js集成到我的应用程序中，对我来说，似乎不可能将对象作为键为标签的数据传递。

现在，我正在尝试使用常规条形图进行尝试，该条形图中的API如下：

data : [1,2,3]
labels: ['a','b','c']

文档允许传递如下内容：

data: [{x:'2016-12-25', y:20}, {x:'2016-12-26', y:10}]

但仅当使用时间标度时。

我的数组来自其他地方，很容易失去顺序，我想传递一些信息，例如：

data: [{a:1},{b:2},{c:3}]

Answer 1

如果您的数据类似于[{a:1},{b:2},{c:3}]，则可以使用

轻松地将其转换为两个数组

let labelArr=[];let dataArr=[];
data.forEach((item)=>{labelArr.push(Object.keys(item) 
[0]);dataArr.push(item[Object.keys(item)[0]])})

这是一种简便的方法，因为chart.js的当前API不支持复杂数据数组，唯一的选择是从chartjs内部扩展Chart.controller.bar，然后通过提取为其分配相同的标签数组

Answer 2

let data =   [1,2,3],
labels=['a','b','c'];

labels.forEach((item,index)=>{
data[index]={[item]:data[index]}
})

  console.log(data); //[{ a: 1 }, { b: 2 }, { c: 3 }]

Chart.js-将数据和标签合并到一个对象中

2 个答案: