繁体   English   中英

使用JavaScript将多级嵌套数组转换为json

[英]convert multilevel nested array using into json using javascript

我有代码,可以从csv文件加载数据,并通过使用D3对数据进行分组来获取数据。

我写的代码是:

                d3.csv("data/data2.csv", function(data1) {      

                  var workStation = 
                                {"key":"Data","values":
                                d3.nest()
                                .key(function(d) { return d.WorkStation_Id; })
                                .key(function(d) { return d.Order_Id; })
                                .rollup(function(v) {
                                    return v.map(function(c){
                                        return { "actualStart": convertscheduledtime(c.ScheduledTime),"rowHeight": 30, "actualEnd":c.Duration*1000+convertscheduledtime(c.ScheduledTime), "name":c.Order_Id};
                                    });
                                }).entries(data1)};

                var d2= [{"name":"Data", "children":workStation.values.map( function(major){  
                        return {
                            "name": major.key,
                            "children":major.values.map( function(Order_Id){
                                return{
                                    "name" : Order_Id.key,
                                    "actualStart" : Order_Id.values.actualStart,
                                    "actualEnd" : Order_Id.values.actualEnd
                                };
                            })
                            };
                        })
                    }];

    });
    console.log(d2);

我正在尝试使用以下在网上找到的代码将获得的结果转换为json格式:我正在尝试执行以下操作:

1)我试图获取开始时间结束时间。 我正在通过添加持续时间来计算开始时间。 2)获得的数组以嵌套键值对的形式出现。 我正在尝试将它们转换为JSON数据,以便可以将其传递到anychart.js的var treeData甘特图中。

以下是我想要实现的JSON数据,直到孩子的名字为止,我都需要得到以下数据:1,对于actualStart和actualEnd,我未将其值定义为: parent : 10A, children:[{ name:1, actualStart:18332233333, actualEnd:12343434444}, { name:2, actualStart:18332233898, actualEnd:12343434998}, .... ], parent : 10B, children: [{ name:1, actualStart:18332233333, actualEnd:12343434444}, { name:2, actualStart:18332233898, actualEnd:12343434998}, .... ] ....有人可以建议我需要进行什么更改以获取actualStart和actualEnd数据。

谢谢。

我已经包含了示例csv数据:

ScheduledTime,WorkStation_Id,Order_Id,Duration(seconds)  

01.01.2016 00:00:00,10A,1,15
01.01.2016 00:00:15,10A,1,25
01.01.2016 00:00:35,10A,1,10
01.01.2016 00:00:45,10A,2,10
01.01.2016 00:00:55,10A,2,10
01.01.2016 00:01:05,10B,1,20
01.01.2016 00:01:25,10B,1,10
01.01.2016 00:01:35,10B,2,20
.....

在这种情况下,您需要一些自定义数据格式。 在下面,您可以找到获取以前提供的.csv数据的代码,然后对其进行解析,分组和格式化。 之后,创建甘特图。 此代码有助于获取所需的数据结构。

//parse .csv data and group by WorkStation_Id
d3.csv("data.csv", function (data1) {
    var workStation = d3.nest()
        .key(function (d) {
            return d.WorkStation_Id;
        })
        .entries(data1);

    //get formatted data as a tree
    var formattedData = formatData(workStation);
    console.log(formattedData);

    //set formatted data as a tree
    var treeData = anychart.data.tree(formattedData, "as-tree");
    // chart type
    chart = anychart.ganttProject();

    // set data for the chart
    chart.data(treeData);

    // set container id for the chart
    chart.container('container').draw();

    // Fit all visible data to timeline.
    chart.fitAll();
});

//helper function to format data in apropriate way
//to set to the gantt chart
function formatData(data) {

    var outputData = [];

    data.forEach(function (item) {
        var itemObj = {};
        itemObj['name'] = item['key'];
        itemObj['children'] = [];

        var childs = item['values'];

        for (var i = 0; i < childs.length; i++) {
            var childObj = {};
            childObj['name'] = 'Order ID: ' + childs[i]['Order_Id'] + '-' + i;
            childObj['actualStart'] = new Date(childs[i]['ScheduledTime']).getTime();
            childObj['actualEnd'] = childObj['actualStart'] + childs[i]['Duration(seconds)'] * 1000;
            childObj['Order_Id'] = childs[i]['Order_Id'];
            itemObj['children'].push(childObj);
        }
        outputData.push(itemObj);
    });
    return outputData;
}

下面是此代码构建的图表的屏幕截图。 在此处输入图片说明

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM