Как подсчитать количество элементов в каждый день в течение месяца из данных json с помощью javascript
Я хочу написать программу для вычисления суммы некоторых переменных за один день для всех данных, представленных в ответе json из базы данных mysql, с помощью вызовов ajax.
В этих данных я хочу получить доступ к
- дата-время,
- Проверено цилиндров,
- ProdRate
переменными таким образом, что на дату 2021-05-30 сумма проверенных цилиндров будет равна 9, а prodRate будет средним значением проверенных продтов и цилиндров.
Например
Дата 1 = 31.05.2021 => CyinderChecked = 1;
(сумма всех проверенных баллонов за один день)ProdRate = 1/1 = 1;
(Сумма продрата за один день, деленная на количество проверенных баллонов за один день.Дата 2 = 30.05.2021 => CylinderChecked = 9;
(сумма всех проверенных баллонов за один день)ProdRate = 6/9 = 0,67;
(Сумма продрата за один день, деленная на количество проверенных баллонов за один день.
let data = [{
"0": "2021-05-31 09:10:27",
"1": "1",
"2": "1",
"Date": "2021-05-31 09:10:27",
"ProdRate": "1",
"CheckedCylinders": "1"
},
{
"0": "2021-05-30 22:03:32",
"1": "1",
"2": "4",
"Date": "2021-05-30 22:03:32",
"ProdRate": "1",
"CheckedCylinders": "4"
},
{
"0": "2021-05-30 18:41:34",
"1": "1",
"2": "9",
"Date": "2021-05-30 18:41:34",
"ProdRate": "1",
"CheckedCylinders": "9"
},
{
"0": "2021-05-30 18:32:28",
"1": "1",
"2": "8",
"Date": "2021-05-30 18:32:28",
"ProdRate": "1",
"CheckedCylinders": "8"
},
{
"0": "2021-05-30 09:20:19",
"1": "1",
"2": "8",
"Date": "2021-05-30 09:20:19",
"ProdRate": "1",
"CheckedCylinders": "8"
}
]
function report(result, dates) {
var totalCy = [],
prodRate = [],
sum1 = 0,
sum2 = 0;
for (let x in result) {
totalCy.push(parseInt(result[x].CheckedCylinders));
prodRate.push(parseInt(result[x].ProdRate));
}
for (x in totalCy && prodRate) {
sum1 = sum1 + totalCy[x];
sum2 = sum2 + prodRate[x];
}
sum2 = sum2 / sum1;
for (var x in dates) {
$(".degassingReportbody").append(`
<tr>
<td>${dates[x]}</td>
<td>${sum1}</td>
<td>${sum2}</td>
</tr>
`);
}
}
function degassingReport(data) {
//DATE & TIME Total Cyl Checked Production Rate
$(".degassingReportHead").append(`
<tr>
<th>DATE & TIME</th>
<th>Total Cyl Checked</th>
<th>Production Rate</th>
</tr>
`);
let date = [];
for (let x in data) {
date.push(data[x].Date.split(" ")[0]);
}
let newDate = new Set(date);
let dates = [...newDate];
for (var x in dates) {
result = data.filter(function(obj) {
return obj.Date.split(" ")[0] == dates[x];
});
}
report(result, dates);
}
degassingReport(data)<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<thead class = "degassingReportHead"></thead>
<tbody class = "degassingReportbody"></tbody>
</table>Вы говорите о данных JSON? Поскольку я скопировал их из инструмента разработчика Chrome, позвольте мне отредактировать их
Да, пожалуйста, не используйте версию инструмента разработчика
ваш образец не соответствует вашим данным json
Я отредактировал данные JSON. @Frenchy мой пример кода получает данные из вызова ajax.
гул для вашего второго свидания, как вы находите 9 для цилиндра, сумма 4 +9 +8 +8?
Я обновил фрагмент (мы используем фрагменты для отображения исполняемого кода) с соответствующим HTML
Так много вещей не работают, я даже не могу их все сделать. Например: let dates = new Set(); data.forEach(({Date}) => dates.add(Date.split(" ")[0]));, почему вы обрабатываете даты снова и снова?
Почему вы показываете одни и те же суммы в каждой строке отчета?
Скорее всего, это не то, что вы думаете. for (x in totalCy && prodRate) {. Вы не можете выполнить for in с двумя итерациями в одном операторе.
@mplungjan благодарит за обновление фрагмента. Спасибо за помощь. На самом деле то, что я делаю, я собираюсь через данные json, беря все даты, помещая их в новый массив, который затем я повторяю с этими данными и сравниваю их с чем-то, если они есть, тогда я сохраняю эти данные в новом объекте результата, вычисляющем проверку цилиндра и норму продукта
@Frenchy раньше у меня было 3 данных в элементе JSON, я добавил еще 2, поэтому теперь расчет будет отличаться в зависимости от дат
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
решение с использованием reduce:
let data = [{
"0": "2021-05-31 09:10:27",
"1": "1",
"2": "1",
"Date": "2021-05-31 09:10:27",
"ProdRate": "1",
"CheckedCylinders": "1"
},
{
"0": "2021-05-30 22:03:32",
"1": "1",
"2": "4",
"Date": "2021-05-30 22:03:32",
"ProdRate": "1",
"CheckedCylinders": "4"
},
{
"0": "2021-05-30 18:41:34",
"1": "1",
"2": "9",
"Date": "2021-05-30 18:41:34",
"ProdRate": "1",
"CheckedCylinders": "9"
},
{
"0": "2021-05-30 18:32:28",
"1": "1",
"2": "8",
"Date": "2021-05-30 18:32:28",
"ProdRate": "1",
"CheckedCylinders": "8"
},
{
"0": "2021-05-30 09:20:19",
"1": "1",
"2": "8",
"Date": "2021-05-30 09:20:19",
"ProdRate": "1",
"CheckedCylinders": "8"
}
]
var groupBy = function(xs, key) {
return xs.reduce(function(rv, x) {
let k = x[key].split(" ")[0];
if (rv[k]){
rv[k][0] += +x.ProdRate;
rv[k][1] += +x.CheckedCylinders;
rv[k][2] += rv[k][0]/rv[k][1];
}else{
rv[k] = [+x.ProdRate,+x.CheckedCylinders, (+x.ProdRate)/(+x.CheckedCylinders)];
}
return rv;
}, {});
};
var groubedByDay=groupBy(data, 'Date');
degassingReport(groubedByDay);
function degassingReport(datas) {
//DATE & TIME Total Cyl Checked Production Rate
$(".degassingReportHead").append(`
<tr>
<th>DATE & TIME</th>
<th>Total Cyl Checked</th>
<th>Production Rate</th>
</tr>
`);
for (var x in datas) {
$(".degassingReportbody").append(`
<tr>
<td>${x}</td>
<td>${datas[x][1]}</td>
<td>${datas[x][2]}</td>
</tr>
`);
}
}<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<thead class = "degassingReportHead"></thead>
<tbody class = "degassingReportbody"></tbody>
</table>
Ваши данные неверны. Вам нужны уникальные идентификаторы и запятые между ними. Кажется, у вас есть массив объектов, но ваше представление недействительно JSON / Object notation