ChartJS 如何在javascript中推送数组多维

wljmcqd8  于 2022-11-06  发布在  Chart.js
关注(0)|答案(4)|浏览(201)

我想使用javascript推送一个多维数组。我需要它来为chartJs设置数据集。我希望得到如下结果:

datasets: [{
    label: 'Manajemen Informatika',
    data: [100, 105, 203, 160, 200],
    backgroundColor: 'rgba(189, 99, 132, 0.2)',
    borderColor: 'rgba(189, 99, 132, 1)',
    borderWidth: 1
}, {
    label: 'Teknik Informatika',
    data: [105, 100, 250, 170, 190],
    backgroundColor: 'rgba(94, 126, 189, 0.2)',
    borderColor: 'rgba(94, 126, 189, 1)',
    borderWidth: 1
}, {
    label: 'Sistem Informasi',
    data: [90, 120, 225, 185, 200],
    backgroundColor: 'rgba(72, 189, 122, 0.2)',
    borderColor: 'rgba(72, 189, 122, 1)',
    borderWidth: 1
}]
nukf8bse

nukf8bse1#

你想要的数据集看起来像一个对象数组,其中花括号内的每个数据都是对象。所以如果你想把多维数组放在JS中,在变量中创建每个对象,向其中添加数据,然后把它推到数组中。就像

let arr = [];
let obj1 = {}; //add data to this object
arr.push(obj1);
let obj2 = {}; //add data to this object
arr.push(obj2);
.
.
.
let objn = {}; //add data to this object
arr.push(objn)
e4yzc0pl

e4yzc0pl2#

首先,你需要先给予你的输入定义。你写的结果只是一个Object数组。多维数组应该像这样:

const multidimensionalArray = [
  [1,2,3,4],
  [12,13,15,16],
  [17,2,31,]
]

对于您的问题,我假设您从后端接收数据:

const responseData = [{data1, data2, data3, data4}]

const result = responseData.map(item => {
   /// Do some manipulate data here
   const stypingObj = item.type ? styling1 : styling2 
   const valueArray = item.valueData  // You can manipulate value also
   return chartData = { ...item. data: valueArray, ...stylingObj }
})

然后返回预期结果。

yizd12fk

yizd12fk3#

请尝试以下代码,To如何在javascript中推送多维数组

var PushToArray = { };
PushToArray.productID = productID;
PushToArray.itemColorTitle = itemProductTitle;
PushToArray.itemColorPath = itemProduct;
cookie_value_add.push(PushToArray);

我希望这段代码对你有用。

  • 谢谢-谢谢
khbbv19g

khbbv19g4#

不用担心,这个架构有点乱,总是很难写和读。
您应该使用类似于以下内容的内容:

var d = {
  datasets: [
    {
      label: 'Manajemen Informatika',
      data: [100, 105, 203, 160, 200],
      backgroundColor: 'rgba(189, 99, 132, 0.2)',
      borderColor: 'rgba(189, 99, 132, 1)',
      borderWidth: 1
    }
  ]
}

d.datasets.push(
  {
    label: 'Sistem Informasi',
    data: [90, 120, 225, 185, 200],
    backgroundColor: 'rgba(72, 189, 122, 0.2)',
    borderColor: 'rgba(72, 189, 122, 1)',
    borderWidth: 1
  }
)

// Read a particular value
console.log(d.datasets[1].label)

// Whole object
console.log(d)

我们不应该自己手工编写对象,但是 * chart.js * 是这样做,强制每个配置都嵌套在对象中,使用插件时最糟糕的是,您还必须在那里传递函数,这会使脚本变得混乱。
边注,建议完全避免使用chart.js,for different reasons

相关问题