javascript - 匹配 JavaScriptObject 中的对象

Question

我有以下数据集 --> data1 和data2:

data = [];

data[0] = [{
    "value": 29,
    "series": 1,
    "category": "Men",
    "fname": "NY",
     "valueColor": "red"
}, {
    "value": 44,
    "series": 2,
    "category": "Men",
    "fname": "GY",
    "valueColor": "blue"
}, {
    "value": 10,
    "series": 3,
    "category": "Men",
    "fname": "HY",
     "valueColor": "orange"
},{
    "value": 0,
    "series": 4,
    "category": "Men",
    "fname": "",
     "valueColor": ""
}, {
    "value": 0,
    "series": 5,
    "category": "Men",
    "fname": "",
    "valueColor": ""
}, {
    "value": 0,
    "series": 6,
    "category": "Men",
    "fname": "",
     "valueColor": ""
}]

data[1] = [
    {
    "value": 0,
    "series": 1,
    "category": "Women",
    "fname": "",
     "valueColor": ""
}, {
    "value": 0,
    "series": 2,
    "category": "Women",
    "fname": "",
    "valueColor": ""
}, {
    "value": 0,
    "series": 3,
    "category": "Women",
    "fname": "",
     "valueColor": ""
},{
    "value": 16,
    "series": 4,
    "category": "Women",
    "fname": "RY",
    "valueColor": "yellow"
}, {
    "value": 23,
    "series": 5,
    "category": "Women",
    "fname": "TY",
    "valueColor": "green"

}, {
    "value": 23,
    "series": 6,
    "category": "Women",
    "fname": "NY",
    "valueColor": "red"

}]


data[2] = [
    {
    "value": 0,
    "series": 1,
    "category": "LG",
    "fname": "",
     "valueColor": ""
}, {
    "value": 0,
    "series": 2,
    "category": "LG",
    "fname": "",
    "valueColor": ""
}, {
    "value": 0,
    "series": 3,
    "category": "LG",
    "fname": "",
     "valueColor": ""
},{
    "value": 16,
    "series": 4,
    "category": "LG",
    "fname": "RY",
    "valueColor": "yellow"
}, {
    "value": 23,
    "series": 5,
    "category": "LG",
    "fname": "TY",
    "valueColor": "green"

}, {
    "value": 23,
    "series": 6,
    "category": "LG",
    "fname": "NY",
    "valueColor": "red"

}]


data2 = [];

data2[0] = [{
    "value": 14,
    "series": 1,
    "category": "Men",
    "fname": "NY",
     "valueColor": "red"
}, {
    "value": 33,
    "series": 2,
    "category": "Men",
    "fname": "CY",
    "valueColor": "blue"
}, {
    "value": 16,
    "series": 3,
    "category": "Men",
    "fname": "KY",
     "valueColor": "orange"
},{
    "value": 0,
    "series": 4,
    "category": "Men",
    "fname": "",
     "valueColor": ""
}, {
    "value": 0,
    "series": 5,
    "category": "Men",
    "fname": "",
    "valueColor": ""
}, {
    "value": 0,
    "series": 6,
    "category": "Men",
    "fname": "",
     "valueColor": ""
}]

data2[1] = [
    {
    "value": 0,
    "series": 1,
    "category": "Women",
    "fname": "",
     "valueColor": ""
}, {
    "value": 0,
    "series": 2,
    "category": "Women",
    "fname": "",
    "valueColor": ""
}, {
    "value": 0,
    "series": 3,
    "category": "Women",
    "fname": "",
     "valueColor": ""
},{
    "value": 22,
    "series": 4,
    "category": "Women",
    "fname": "RY",
    "valueColor": "yellow"
}, {
    "value": 21,
    "series": 5,
    "category": "Women",
    "fname": "TY",
    "valueColor": "green"

}, {
    "value": 13,
    "series": 6,
    "category": "Women",
    "fname": "SY",
    "valueColor": "red"

}]


data2[2] = [
    {
    "value": 0,
    "series": 1,
    "category": "LG",
    "fname": "",
     "valueColor": ""
}, {
    "value": 0,
    "series": 2,
    "category": "LG",
    "fname": "",
    "valueColor": ""
}, {
    "value": 0,
    "series": 3,
    "category": "LG",
    "fname": "",
     "valueColor": ""
},{
    "value": 26,
    "series": 4,
    "category": "LG",
    "fname": "RY",
    "valueColor": "yellow"
}, {
    "value": 8,
    "series": 5,
    "category": "LG",
    "fname": "TY",
    "valueColor": "green"

}, {
    "value": 33,
    "series": 6,
    "category": "LG",
    "fname": "NY",
    "valueColor": "red"

}]

以下代码根据fname属性查找配对对象并分配相同的颜色。它有效且实用。最初它加载data，当我单击按钮时，它加载data2。然而，物体颜色发生变化，我想让颜色保持一致。

例如，假设数据中的 fname=NY 颜色为红色，我想要与 data2 中的 fname=NY 相同的颜色

function colorSpectrumm(N) {
    var colorMap = [];
    for (i = 1; i < N; i++) {
        var r = getRndColor()
        var g = getRndColor();
        var b = getRndColor();
        colorMap.push("#" + r + g + b);
    }
    return colorMap;
}

function getRndColor() {
    var n = Math.floor(Math.random() * 255);
    var hex = Number(n).toString(16);
    if (hex.length < 2) {
        hex = "0" + hex;
    }
    return hex;
}

//match same fname and assign the same color
function process(data) {
    var map = {};
    colorMap = colorSpectrumm(data.length);
    data.forEach(function (item, index) {
        if (!map.hasOwnProperty(item.fname) && item.valueColor != "") {
            map[item.fname] = colorMap[index];
        }
        data[index].valueColor = map[item.fname];
    });

 return data;
}

function dataReduce(data){
   data = data.reduce(function (a, b) {
    return a.concat(b)
  });

  return data;
}

data = dataReduce(data);
data = process(data);

FIDDLE

Answer 1

类似的事情应该做

function makeSameColorsFrom(data1, data2){
  data2.forEach(function(item, index){
    data2[index].valueColor = findItemInObject(data1, item.fname);
  });
  return data2;
}
function findItemInObject(obj, fname){
  var i = $.grep(obj, function(e){ return e.fname == fname; });
  return i.length ? i[0].valueColor : undefined;
}         

var data2 = makeSameColorsFrom(data, data2);
console.log(data, data2);

<小时/>

function makeSameColorsFrom(data1, data2)

此方法在第二个参数 (data2) 中设置每个项目的 valueColor 属性，并通过迭代第一个参数 (data1) 并搜索具有相似 fname 的项目

function findItemInObject(obj, fname)

此方法获取一个对象并对其进行迭代，并搜索与提供的 fname 相同的第一个项目

这是一个演示 http://jsbin.com/pideji/1/edit?js,output