#javascript #data-structures #highcharts
#javascript #структуры данных #графики
Вопрос:
Учитывая, что у меня есть два массива объектов, которые имеют следующую структуру:
{
avg: 195.6
max: 195.6
min: 195.6
time: 1552448311000
}
Теперь для примера: первый массив содержит данные для датчика температуры, а второй массив содержит данные для конкретной загрузки двигателя. Для построения этих данных мне нужны данные в основном в следующем формате для каждой точки, которую я рисую: [нагрузка, температура], так что это график зависимости температуры от нагрузки.
Как я могу объединить эти два массива, чтобы учитывались только те точки, в которых есть совпадающая временная метка (пара)? Идея в том, что я мог бы сделать что-то подобное в конце с одним объединенным массивом:
mergedArray.map(x => [x.load, x.avg])
Данные могут иметь различия в объеме данных, например, температурных точек может быть намного больше, чем точек загрузки, поэтому мне нужно сначала отфильтровать данные о температуре, чтобы включить только те точки, в которых есть совпадающая временная метка в серии загрузки.
Пример данных:
const temperatureData = [
{
avg: 195.6,
max: 195.6,
min: 195.6,
time: '1.1.2019'
},
{
avg: 300,
max: 300,
min: 300,
time: '1.2.2019'
}
]
const loadData = [
{
avg: 195.6,
max: 195.6,
min: 195.6,
time: '1.1.2019'
}
]
const expected = [{
avg: 195.6,
max: 195.6,
min: 195.6,
time: '1.1.2019',
load: 195.6
}]
таким образом, были взяты только первые данные о температуре, поскольку они имеют соответствующую временную метку в данных загрузки.
Один симпатичный (?) Способ сделать это был бы ниже, какие-либо отзывы?
// First filter the load by set load filter
const filteredLoad = load.filter(x => x.avg >= this.props.filter);
// Collect the timestamps of the filtered load
const loadTimeStamps = filteredLoad.map(x => x.time);
const filteredTemperatures = temperaturData.filter(x => loadTimeStamps.includes(x.time))
.map ((c, i) => {
if (!filteredLoad[i]) return null;
return {
...c,
load: filteredLoad[i].avg
}
})
Комментарии:
1. Можете ли вы сказать, ожидаемый ввод и вывод?
2. @Hongarc Я добавил простой пример
3. Немного не по теме вашего вопроса, но чего вы пытаетесь достичь в highcharts, что-то вроде этого: highcharts.com/demo/synchronized-charts ? Или вы пытаетесь сделать так, чтобы во всплывающей подсказке была вся соответствующая информация. Я думаю, что было бы проще (и менее ресурсоемко) играть с сюжетом вместо слияния такого рода данных раньше. Я, конечно, могу ошибаться.
4. @ewolden да, это тоже одна из возможностей. Спасибо за предложение.
Ответ №1:
Вы можете использовать циклы для фильтрации и объединения данных:
var newData = [];
for (var i = 0; i < temperatureData.length; i ) {
for (var j = 0; j < loadData.length; j ) {
if (temperatureData[i].time === loadData[j].time) {
newData.push(temperatureData[i]);
newData[newData.length - 1].load = loadData[j].avg
j = loadData.length;
}
}
}
Живая демонстрация: http://jsfiddle.net/BlackLabel/9xsdqwct /