Question

var data= [
{"area":"1","location":"01051A","aisle":"1","sequence":12354,"x":13,"y":1338},
{"area":"1","location":"01071A","aisle":"1","sequence":12355,"x":13,"y":1437},
{"area":"1","location":"01081A","aisle":"1","sequence":12356,"x":173,"y":1437},
{"area":"1","location":"02021A","aisle":"2","sequence":12473,"x":401,"y":1092},
{"area":"1","location":"02022A","aisle":"2","sequence":12472,"x":401,"y":1140},
{"area":"1","location":"02031A","aisle":"2","sequence":12471,"x":241,"y":1191},
{"area":"1","location":"02032A","aisle":"2","sequence":12470,"x":241,"y":1239},
{"area":"1","location":"02041A","aisle":"2","sequence":12469,"x":401,"y":1191},
{"area":"1","location":"02042A","aisle":"2","sequence":12468,"x":401,"y":1239},
{"area":"1","location":"03101A","aisle":"3","sequence":12476,"x":629,"y":1437},
{"area":"1","location":"03102A","aisle":"3","sequence":12477,"x":629,"y":1485},
{"area":"1","location":"03111A","aisle":"3","sequence":12478,"x":469,"y":1536},
{"area":"1","location":"03112A","aisle":"3","sequence":12479,"x":469,"y":1584}
]

我有这组数据。过滤每个过道的最佳方法是什么？和那套一起工作？例如，我想找出过道1的最小和最大序列，做一些事情，然后过道2 ......做点什么等等......

目前我正在使用类似的方式获取所有数据的最小和最大坐标。

 var minX = Math.min.apply(null, data.map(function(a){return a.x;})),
 maxX = Math.max.apply(null, data.map(function(a){return a.x;})),
   minY = Math.min.apply(null, data.map(function(a){return a.y;})),
   maxY  = Math.max.apply(null, data.map(function(a){return a.y;}));

但是我还需要找到min，max和每个集合，这样我就可以在屏幕上获得坐标和绘制标签。

我正在考虑循环，然后创建一个独特的过道数组，然后再次循环数据，但我认为这将是一个更好的方法。

以下是我正在处理的JsFiddle。

Answer 1

您可以使用对象收集aisle，x，y及其min和max值。

var data = [{ area: "1", location: "01051A", aisle: "1", sequence: 12354, x: 13, y: 1338 }, { area: "1", location: "01071A", aisle: "1", sequence: 12355, x: 13, y: 1437 }, { area: "1", location: "01081A", aisle: "1", sequence: 12356, x: 173, y: 1437 }, { area: "1", location: "02021A", aisle: "2", sequence: 12473, x: 401, y: 1092 }, { area: "1", location: "02022A", aisle: "2", sequence: 12472, x: 401, y: 1140 }, { area: "1", location: "02031A", aisle: "2", sequence: 12471, x: 241, y: 1191 }, { area: "1", location: "02032A", aisle: "2", sequence: 12470, x: 241, y: 1239 }, { area: "1", location: "02041A", aisle: "2", sequence: 12469, x: 401, y: 1191 }, { area: "1", location: "02042A", aisle: "2", sequence: 12468, x: 401, y: 1239 }, { area: "1", location: "03101A", aisle: "3", sequence: 12476, x: 629, y: 1437 }, { area: "1", location: "03102A", aisle: "3", sequence: 12477, x: 629, y: 1485 }, { area: "1", location: "03111A", aisle: "3", sequence: 12478, x: 469, y: 1536 }, { area: "1", location: "03112A", aisle: "3", sequence: 12479, x: 469, y: 1584 }],
    values = Object.create(null);

data.forEach(function (o) {
    if (!values[o.aisle]) {
        values[o.aisle] = { x: { min: o.x, max: o.x }, y: { min: o.y, max: o.y } };
        return;
    }
    ['x', 'y'].forEach(function (k) {
        ['min', 'max'].forEach(function (m) {
            values[o.aisle][k][m] = Math[m](values[o.aisle][k][m], o[k]);
        });
    });
});
        
console.log(values);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

var aisles = {};

data.forEach(d => {
  if (!aisles[d.aisle]) {
    aisles[d.aisle] = {
      maxX: d.x,
      minX: d.x,
      maxY: d.y,
      minY: d.y
    };
  } else {  
    aisles[d.aisle].maxX = Math.max(aisles[d.aisle].maxX, d.x);
    aisles[d.aisle].minX = Math.min(aisles[d.aisle].minX, d.x);
    aisles[d.aisle].maxY = Math.max(aisles[d.aisle].maxY, d.y);
    aisles[d.aisle].minY = Math.min(aisles[d.aisle].minY, d.y);
  }
})

Answer 3

这是使用Array.reduce的另一种风格

var data = [{ area: "1", location: "01051A", aisle: "1", sequence: 12354, x: 13, y: 1338 }, { area: "1", location: "01071A", aisle: "1", sequence: 12355, x: 13, y: 1437 }, { area: "1", location: "01081A", aisle: "1", sequence: 12356, x: 173, y: 1437 }, { area: "1", location: "02021A", aisle: "2", sequence: 12473, x: 401, y: 1092 }, { area: "1", location: "02022A", aisle: "2", sequence: 12472, x: 401, y: 1140 }, { area: "1", location: "02031A", aisle: "2", sequence: 12471, x: 241, y: 1191 }, { area: "1", location: "02032A", aisle: "2", sequence: 12470, x: 241, y: 1239 }, { area: "1", location: "02041A", aisle: "2", sequence: 12469, x: 401, y: 1191 }, { area: "1", location: "02042A", aisle: "2", sequence: 12468, x: 401, y: 1239 }, { area: "1", location: "03101A", aisle: "3", sequence: 12476, x: 629, y: 1437 }, { area: "1", location: "03102A", aisle: "3", sequence: 12477, x: 629, y: 1485 }, { area: "1", location: "03111A", aisle: "3", sequence: 12478, x: 469, y: 1536 }, { area: "1", location: "03112A", aisle: "3", sequence: 12479, x: 469, y: 1584 }];

var retData = data.reduce(function(ret, current) {
    ret[current.aisle] = ret[current.aisle] || {};
    ret[current.aisle]['maxX'] = Math.max(ret[current.aisle]['maxX'], current.x) || current.x;
    ret[current.aisle]['maxY'] = Math.max(ret[current.aisle]['maxY'], current.y) || current.y;
    ret[current.aisle]['minX'] = Math.min(ret[current.aisle]['minX'], current.x) || current.x;
    ret[current.aisle]['minY'] = Math.min(ret[current.aisle]['minY'], current.y) || current.y;
    return ret;
}, {});

console.log(retData);

Answer 4

我还建议将任何'aisle'集合作为对象密钥与该aisle uniq密钥组合，其中valus将包含按需求排序/排序的对象数组（例如x +的总和） y等等。

过滤并循环遍历JavaScript对象数组

4 个答案: