两个不同的数组公用一个柱状图,合并成一个横坐标(对比)

4 篇文章 0 订阅
3 篇文章 0 订阅

两个数组合并去重

应用场景:
有一个对象,该对象下有两个数组:把这两个数组展示在柱状图上,
但是这两个数组的nam列不同,但是只有一个横坐标,所以需要把两个数组的name属性合并在一个数组中:

var graphList = {
	guestList:[
		{name:'A1',number:12},
		{name:'A2',number:112},
	],
	guestListCompared: [
		{name:'A1',number:13},
		{name:'A44',number:32},
		{name:'A32',number:132},
	]
}

把这个两个数组合并成两个数组,这两个数组的长度和name 顺序相同:
这样:
没有值的用-代替

list: [
		{name:'A1',number:12},
		{name:'A2',number:112},
		{name:'A44',number:-},
		{name:'A32',number:-},
];
compareList: [
		{name:'A1',number:13},
		{name:'A2',number:-},
		{name:'A44',number:32},
		{name:'A32',number:132},
];

用于下列图:
在这里插入图片描述

for(let one of this.graphList.guestList){ //把数组guestList 的name push到commonXlist中
	commonXList.push(one.name)
}
for(let one of this.graphList.guestListCompared){ //把数组guestListCompared的name push到commonXlist中
 	commonXList.push(one.name)
}

commonXList =[...new Set(commonXList)];  // 去重

let list =Array(commonXList.length).fill('-') // 给数组每一项填充 ‘-’
let compareList =Array(commonXList.length).fill('-')

for(let one of this.graphList.guestList){ // 遍历guestList
  let index = commonXList.indexOf(one.name); // 如果commonXList中有guestList 中的name
  list[index] = one.number  // 就把对应的值复制给对应的位置
}

for(let one of this.graphList.guestListCompared){
  let index = commonXList.indexOf(one.name);
  compareList[index] = one.number
}

最后得到两个新的数组,他们的长度和name顺序相同;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值