【问题标题】:Converting data from an array of objects of one kind to another将数据从一种对象数组转换为另一种对象
【发布时间】:2021-04-23 11:06:21
【问题描述】:

有一组数据动态来自服务器,如下所示:

dataSet = [
 {vid: "General uneven corrosion", mk: "Visual measurement control",  ver: "95"}, 
 {vid: "General uneven corrosion", mk: "Ultrasonic thickness measurement", ver: "95"},
 {vid: "General uneven corrosion", mk: "Ultrasonic flaw detection", ver: "80"},
 {vid: "General uneven corrosion", mk: "Radiographic control", ver: "80"},
 {vid: "General uneven corrosion", mk: "Eddy current control", ver: "60"},
 {vid: "General uneven corrosion", mk: "Magnetic control", ver: "20"},
 {vid: "General uneven corrosion", mk: "Metallographic research", ver: "20"},
 {vid: "Increase in strength characteristics", mk: "Mechanical property studies", ver: "80"},
 {vid: "Increase in strength characteristics", mk: "Coercimetry", ver: "40"},
 {vid: "Increase in strength characteristics", mk: "Metallographic research", ver: "40"},
 {vid: "Increase in hardness", mk: "Mechanical property studies", ver: "95"},
 {vid: "Increase in hardness", mk: "Coercimetry", ver: "60"},
 {vid: "Increase in hardness", mk: "Metallographic research", ver: "40"},
 {vid: "Decreased ductility", mk: "Coercimetry", ver: "60"},
 {vid: "Decreased ductility", mk: "Mechanical property studies", ver: "60"},
 {vid: "Decreased ductility", mk: "Acoustic emission control", ver: "60"},
 {vid: "Decreased ductility", mk: "Magnetic control", ver: "60"},
 {vid: "Decreased ductility", mk: "Eddy current control", ver: "40"},
 {vid: "Decreased ductility", mk: "Metallographic research", ver: "40"},
 {vid: "Decreased ductility", mk: "Visual measurement control", ver: "20"}
];

要使用 D3 绘制分组条形图,我需要将数据转换为以下对象数组:

data = [
  {State: "General uneven corrosion", Visual measurement control: 95, Ultrasonic thickness measurement: 95, Ultrasonic flaw detection: 80, Radiographic control: 80, Eddy current control: 60, Magnetic control: 20, Metallographic research: 20, Mechanical property studies: 0, Coercimetry: 0, Acoustic emission control: 0},
  {State: "Increase in strength characteristics", Visual measurement control: 0, Ultrasonic thickness measurement: 0, Ultrasonic flaw detection: 0, Radiographic control: 0, Eddy current control: 0, Magnetic control: 0, Metallographic research: 40, Mechanical property studies: 80, Coercimetry: 40, Acoustic emission control: 0},
  {State: "Increase in hardness", Visual measurement control: 0, Ultrasonic thickness measurement: 0, Ultrasonic flaw detection: 0, Radiographic control: 0, Eddy current control: 0, Magnetic control: 0, Metallographic research: 40, Mechanical property studies: 95, Coercimetry: 60, Acoustic emission control: 0},
  {State: "Decreased ductility", Visual measurement control: 20, Ultrasonic thickness measurement: 0, Ultrasonic flaw detection: 0, Radiographic control: 0, Eddy current control: 40, Magnetic control: 60, Metallographic research: 40, Mechanical property studies: 60, Coercimetry: 60, Acoustic emission control: 60}, 
  columns: ["State", "Visual measurement control", "Ultrasonic thickness measurement", "Ultrasonic flaw detection", "Radiographic control", "Eddy current control", "Magnetic control", "Metallographic research", "Mechanical property studies", "Coercimetry", "Acoustic emission control"]
  y: "Detectability"
];

这是每个 State 具有唯一值 vid 的地方,并且最终 data 数组的每个对象都包含一组 马克。对于每个对象,mk在set中的顺序是一样的,每个mk的值对应初始dataSet,如果没有这个数据则取0种。

我可以获得特定键的唯一值数组,

let allMk = []
dataSet.forEach(item => {
     allMk.push(item.mk)
});
let allMkUni = new Set (allMk)

但我不明白如何正确地将对象转换为所需的形式。 请帮忙。谢谢

【问题讨论】:

  • 您的预期结果是无效的 JavaScript。

标签: javascript arrays object d3.js


【解决方案1】:

可能最容易将reduce() 转换为中间对象,然后将map() entries 转换为数组:

const data = [
 {vid: "General uneven corrosion", mk: "Visual measurement control",  ver: "95"}, 
 {vid: "General uneven corrosion", mk: "Ultrasonic thickness measurement", ver: "95"},
 {vid: "General uneven corrosion", mk: "Ultrasonic flaw detection", ver: "80"},
 {vid: "General uneven corrosion", mk: "Radiographic control", ver: "80"},
 {vid: "General uneven corrosion", mk: "Eddy current control", ver: "60"},
 {vid: "General uneven corrosion", mk: "Magnetic control", ver: "20"},
 {vid: "General uneven corrosion", mk: "Metallographic research", ver: "20"},
 {vid: "Increase in strength characteristics", mk: "Mechanical property studies", ver: "80"},
 {vid: "Increase in strength characteristics", mk: "Coercimetry", ver: "40"},
 {vid: "Increase in strength characteristics", mk: "Metallographic research", ver: "40"},
 {vid: "Increase in hardness", mk: "Mechanical property studies", ver: "95"},
 {vid: "Increase in hardness", mk: "Coercimetry", ver: "60"},
 {vid: "Increase in hardness", mk: "Metallographic research", ver: "40"},
 {vid: "Decreased ductility", mk: "Coercimetry", ver: "60"},
 {vid: "Decreased ductility", mk: "Mechanical property studies", ver: "60"},
 {vid: "Decreased ductility", mk: "Acoustic emission control", ver: "60"},
 {vid: "Decreased ductility", mk: "Magnetic control", ver: "60"},
 {vid: "Decreased ductility", mk: "Eddy current control", ver: "40"},
 {vid: "Decreased ductility", mk: "Metallographic research", ver: "40"},
 {vid: "Decreased ductility", mk: "Visual measurement control", ver: "20"}
];

const result = Object.entries(data.reduce((a, {vid, mk, ver}) => {
  a[vid] = a[vid] || {};
  a[vid][mk] = ver;
  return a;
}, {})).map(([k, v]) => ({State: k, ...v}));

console.log(result)

【讨论】:

  • 非常感谢!令人惊讶的是你做的如此之快!最后一个问题是,相同的数据集及其在每个最终对象中的顺序如何?有可能吗?
  • 我不明白你的意思,但是 JavaScript 中的属性通常被认为是无序的。我会更新我的答案以添加您在问题中提到的columns,但您的预期输出无效,所以我不知道您到底需要什么。
  • 我的意思是,结果数组中的每个对象都必须具有相同的键集。不管它们是否存在于源数据中。这些键的值取自原始数据集(如果存在),或者等于 0(如果不存在此类属性)。因为我需要在图表上显示所有数据,即使是 0
  • 最简单的方法是定义一个包含所有零值键的默认对象,然后每次都克隆它。所以不是a[vid] = a[vid] || {};,而是a[vid] = a[vid] || {...defaultValues};
猜你喜欢
  • 2021-06-20
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-12-13
  • 2018-11-09
  • 1970-01-01
相关资源
最近更新 更多