js数组行转列

最新推荐文章于 2023-03-20 19:52:28 发布

原创最新推荐文章于 2023-03-20 19:52:28 发布 · 2.1k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #jquery #html5

本文介绍了一种将JSON数据中X与Y轴数据进行转换的方法，通过自定义函数实现行列互换，适用于图表展示前的数据预处理。示例代码展示了如何将时间序列数据从行转为列，便于进一步分析和可视化。

最近研究一个问题，数据表取出的数据需要通过图表的形式展示，但图标X与y轴的数据相反，需要进行行列转换，查了很多资料，通过修改，最后得出自己需要的结果，直接上代码


        /* json数据行列转换
     * @jsonData json数据源
     * @colField 生成列名的字段
     * @colName 生成列名的名称
     * @valueField 生成值的字段
    */
        function row2col(jsonData, colField, colName,valueField) {
            var result = []; //存储返回的数据
            var colFields = colField.split(',');
            var colNames = colName.split(',');
            // 指定的colFields列下的数据作为y轴，则取出该列的数据作为y轴即可
            for (var i = 0; i < colFields.length; i++) {
                var curRecord = {};
                curRecord["mc"] = colNames[i];
            // 循环整个JSON数组：
            for (var idx = 0; idx < jsonData.length; idx++) {

                //当前json数据对象
                var cdata = jsonData[idx];
                var key = colFields[i];
                //获取到colField的值，作为列名
                var value = cdata[valueField];
                curRecord[value] = cdata[key];
                   

                    //存储列名
                    //resultColumns[value] = null;
                    //break;
                }

                //除数据内容外，还需要添加主键数据  
                //curRecord[idField] = idValue;

                //对象若为新建 则新增进数组
                //if (num == null) {
                //    idIndexData[idValue] = result.push(curRecord) - 1;
                // }

                result[i] = curRecord;
            }
            
            return result;
        }

//测试代码：
 var jsonData = [
                { rq: 201201, rs: 500, je: 4500, pjje: 24 },
                { rq: 201202, rs: 700, je: 6500, pjje: 54 },
                { rq: 201203, rs: 800, je: 7500, pjje: 64},
                { rq: 201204, rs: 900, je: 8500, pjje: 74}];

            
            var colField = 'rs,je,pjje', colName = "人数,金额,平均金额", valueField = 'rq'; 
            var resultData = row2col(jsonData, colField, colName, valueField);

输出结果：
resultData=[
{ mc:‘人数’, 201201:500, 201202:700, 201203:800, 201204:900 },
{ mc:‘金额’, 201201:45500, 201202:6500, 201203:7500, 201204:8500 },
{ mc:‘平均金额’, 201201:24, 201202:54, 201203:64, 201204:74 },
]