json 对象中的默认值基于同一数组中其他对象的内容

Question

我现在很迷茫并且已经为此工作了大约 6 天，如果这有点令人困惑，请原谅我。我正在使用 NVD3 来显示一些基于来自 BigQuery 的数据的图表。所有传入的数据都是正确的，图形实现也是正确的，问题是实际的 JSON 数据。多条形图要求每个 "set" 数据在初始数组下具有相同的日期和相同数量的值。根据我的数据，如果用户当天没有记录事件或其他内容，有时会出现缺失值。

我在这里尝试做的事情的总体思路是遍历初始 json 并附加到 "missing" 值。例如，这将是我从 BigQuery 和我的 API:

中获取的初始数据

[
  "t1":{
    "target": "t1",
    "datapoints": [
      [
        16.0,
        1483747200.0
      ],
      [
        10.0,
        1484352000.0
      ]
    ]
  },
  "t2":{
    "target": "t2",
    "datapoints": [
      [
        10.0,
        1483660800.0
      ],
      [
        19.0,
        1484006400.0
      ],
      [
        10.0,
        1484956800.0
      ]
    ]
  }
]

你可以在这里看到，第一个对象有一个包含 2 个值的数据点数组，第二个对象有一个包含 3 个值的数据点数组。 datapoints 数组的 1 索引包含一个 UNIX 日期，整个对象中的每个 datapoints 数组都必须有一个包含日期的数组，然后 0 作为默认值。所以格式化的数据看起来像这样：

[
  "t1":{
    "target": "t1",
    "datapoints": [
      [
        16.0,
        1483747200.0
      ],
      [
        10.0,
        1484352000.0
      ],
      [
        0.0,
        1483660800.0
      ],
      [
        0.0,
        1484006400.0
      ],
      [
        0.0,
        1484956800.0
      ]
    ]
  },
  "t2":{
    "target": "t2",
    "datapoints": [
      [
        10.0,
        1483660800.0
      ],
      [
        19.0,
        1484006400.0
      ],
      [
        10.0,
        1484956800.0
      ],
      [
        0.0,
        1483747200.0
      ],
      [
        0.0,
        1484352000.0
      ]
    ]
  }
]

我真的不知道从这里去哪里，任何帮助都会非常有帮助。我已经为此工作了好几天，此时我只是磨磨蹭蹭。谢谢

基本上，在一个数组中找到但在其他数组中找不到的每个值都应采用时间戳，但将第一个 value/index 设置为 0。

我还应该提到，该查询仅查询 30 天前的数据，因此每个数据点数组最多有 30 个数组。

Answer 1

下面是一个快速但肮脏的解决方案。请注意，我在您提供的示例中添加了一个附加条目，以便两个数据对象都包含一个具有共同日期的数据点。

var orig= [
  {
    "target": "t1",
    "datapoints": [
      [
        16.0,
        1483747200.0
      ],
      [
        10.0,
        1484352000.0
      ],
      [
        10.0,
        1483660800.0
      ]
    ]
  },
  {
    "target": "t2",
    "datapoints": [
      [
        10.0,
        1483660800.0
      ],
      [
        19.0,
        1484006400.0
      ],
      [
        10.0,
        1484956800.0
      ]
    ]
  }
];
console.log('Original Data', JSON.stringify(orig));

// Get a list of all the datapoint dates
var dates = [];
orig.forEach(function(item) {
  item.datapoints.forEach(function(dp) {
    var date = dp[1];
    dates.push(date);
  })
});
console.log('All Dates', JSON.stringify(dates));

// Remove duplicates from array
dates = dates.filter(function (el, i, arr) {
    return arr.indexOf(el) === i;
});
console.log('Unique Dates', JSON.stringify(dates));

// Check each item in the original array for records for each date and add a
// 0 value entry if the date entry is missing
dates.forEach(function(dt) {
  orig.forEach(function(item, itemIndex) {
    var hasEntry = false;

    item.datapoints.forEach(function(dp) {
      if (dp[1] === dt) hasEntry = true;
    });

    if (!hasEntry) {
      item.datapoints.push([0, dt]);
    }
  });
});

console.log('Updated Data', JSON.stringify(orig));

这里是相应的 plunker，因此您可以看到它的实际效果：https://plnkr.co/edit/K1NK2Xx8RNrqyp7yZ3n2?p=preview

Answer 2

您需要先进行一些数据处理以获取所有日期，然后只需为每个日期填写实际数据即可。

const json = [
  {
    "target": "t1",
    "datapoints": [
      [
        16.0,
        1483747200.0
      ],
      [
        10.0,
        1484352000.0
      ]
    ]
  },
  {
    "target": "t2",
    "datapoints": [
      [
        10.0,
        1483660800.0
      ],
      [
        19.0,
        1484006400.0
      ],
      [
        10.0,
        1484956800.0
      ]
    ]
  }
]

// using es6 set
const dates = new Set()

json.forEach( x => x.datapoints.map( dp => dates.add(dp[1]) ) )

// all dates are there
dates.forEach( d => console.log(d) )

const fillDp = dp => {
    return Array.from(dates).sort().map( d => dp.find( x => x[1] === d ) || [0,d] )
}

const result = json.map( x => Object.assign(x, {datapoints: fillDp(x.datapoints)}) )
  
console.log(JSON.stringify(result[0].datapoints))

json 对象中的默认值基于同一数组中其他对象的内容

Default values in json object based on contents of other objects in the same array

javascript

jquery

d3.js

nvd3.js