Упростить переменную массива JavaScript

Question

Я хочу упростить этот код.Есть ли способ так?Spring MVC + Apex Charts

var d = /*[[${s0}]]*/ null`;  <-- It is sent via the Spring Framework. Basically represents datetime(in millis) at `d[0]`, `d[3]`,... Temperature at `d[1]`, `d[4]`,... and Humidity at `d[2]`, `d[5]`,...


                        <script type="text/javascript" th:inline="javascript">
                        var d = /*[[${s0}]]*/ null;
                        var options = {
                            chart: {
                                type: 'area',
                                height: 300
                            },
                            series: [
                                {
                                    name: 'Temperature',
                                    data: [
                                        [d[0], d[1]],
                                        [d[3], d[4]],
                                        [d[6], d[7]],
                                        [d[9], d[10]],
                                        [d[12], d[13]],
                                        [d[15], d[16]],
                                        [d[18], d[19]],
                                        [d[21], d[22]],
                                        [d[24], d[25]],
                                        [d[27], d[28]],
                                        [d[30], d[31]],
                                        [d[33], d[34]],
                                        [d[36], d[37]],
                                        [d[39], d[40]],
                                        [d[42], d[43]],
                                        [d[45], d[46]],
                                        [d[48], d[49]],
                                        [d[51], d[52]],
                                        [d[54], d[55]],
                                        [d[57], d[58]],
                                        [d[60], d[61]],
                                        [d[63], d[64]],
                                        [d[66], d[67]],
                                        [d[69], d[70]]
                                    ]
                                },
                                {
                                    name: "Humidity",
                                    data: [
                                        [d[0], d[2]],
                                        [d[3], d[5]],
                                        [d[6], d[8]],
                                        [d[9], d[11]],
                                        [d[12], d[14]],
                                        [d[15], d[17]],
                                        [d[18], d[20]],
                                        [d[21], d[23]],
                                        [d[24], d[26]],
                                        [d[27], d[29]],
                                        [d[30], d[32]],
                                        [d[33], d[35]],
                                        [d[36], d[38]],
                                        [d[39], d[41]],
                                        [d[42], d[44]],
                                        [d[45], d[47]],
                                        [d[48], d[50]],
                                        [d[51], d[53]],
                                        [d[54], d[56]],
                                        [d[57], d[59]],
                                        [d[60], d[62]],
                                        [d[63], d[65]],
                                        [d[66], d[68]],
                                        [d[69], d[71]]
                                    ]
                                }
                            ],
                            xaxis: {
                                type: 'datetime'
                            },
                            yaxis: [
                                {
                                    axisTicks: {
                                        show: true
                                    },
                                    axisBorder: {
                                        show: true,
                                    },
                                    title: {
                                        text: "Temperature"
                                    }
                                }, {
                                    min: 0,
                                    max: 100,
                                    opposite: true,
                                    axisTicks: {
                                        show: true
                                    },
                                    axisBorder: {
                                        show: true,
                                    },
                                    title: {
                                        text: "Humidity"
                                    }
                                }
                            ],
                            legend: {
                                position: 'top',
                                horizontalAlign: 'center'
                            },
                            tooltip: {
                                x: {
                                    format: 'HH:mm dd/MM/yy'
                                },
                            }
                        }
                        var chart = new ApexCharts(document.querySelector("#chart0"), options);
                        chart.render();
                    </script>

Мне просто нужно упростить отправку данных через d[0], d[1] и т. Д. Могу ли я использовать какой-либо цикл или что-то еще?

Answer 1

Спасибо, Нина.Кодекс не работал точно так, как я хотел, но был настолько полезен, чтобы исправить мой собственный.Большое спасибо!Вот некоторый фиксированный код:)

var data = /*[[${s0}]]*/ null;

                        function mapByPattern(data, pattern, offset) {
                            var result = [], i = 0;
                            while (i < data.length) {
                                result.push(pattern.map(j => data[i + j]));
                                i += offset;
                            }
                            return result;
                        }

                        var options = {
                            chart: {
                                type: 'area',
                                height: 300
                            },
                            series: [
                                {
                                    name: 'Temperature',
                                    data: mapByPattern(data, [0, 1], 3)
                                },
                                {
                                    name: "Humidity",
                                    data: mapByPattern(data, [0, 2], 3)
                                }
                            ],
                            xaxis: {
                                type: 'datetime'
                            },
                            yaxis: [
                                {
                                    axisTicks: {
                                        show: true
                                    },
                                    axisBorder: {
                                        show: true,
                                    },
                                    title: {
                                        text: "Temperature"
                                    }
                                }, {
                                    min: 0,
                                    max: 100,
                                    opposite: true,
                                    axisTicks: {
                                        show: true
                                    },
                                    axisBorder: {
                                        show: true,
                                    },
                                    title: {
                                        text: "Humidity"
                                    }
                                }
                            ],
                            legend: {
                                position: 'top',
                                horizontalAlign: 'center'
                            },
                            tooltip: {
                                x: {
                                    format: 'HH:mm dd/MM/yy'
                                },
                            }
                        }
                        var chart = new ApexCharts(document.querySelector("#chart0"), options);
                        chart.render();

Answer 2

Вы можете взять функцию, которая берет данные и шаблон для искомых элементов и смещение для приращения для следующей строки.

function mapByPattern(data, pattern, offset) {
    var result = [], i = 0;
    while (i < data.length) {
        result.push(pattern.map(j => data[i + j]));
        i += offset;
    }
    return result;
}

var data = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11],
    result = { series: [
        { name: 'Temperature', data: mapByPattern(data, [0, 1], 3) },
        { name: "Humidity",    data: mapByPattern(data, [0, 2], 3) }
    ]};

console.log(result);