js数组行转列

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

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

最近研究一个问题,数据表取出的数据需要通过图表的形式展示,但图标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 },
]

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值