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

标签 javascript arrays json d3.js anychart

我有代码,我在其中从 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数据,我得到了我想要的数据,直到 child 的名字:1,对于actualStart和actualEnd,我的值未定义: 父级:10A, children :[{ 姓名:1, 实际开始:18332233333, 实际结束:12343434444}, { 姓名:2, 实际开始:18332233898, 实际结束:12343434998}, .... ], 家长:10B, children : [{ 姓名:1, 实际开始:18332233333, 实际结束:12343434444}, { 姓名:2, 实际开始:18332233898, 实际结束: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;
}

下面是由此代码构建的图表的屏幕截图。 enter image description here

关于javascript - 使用javascript将多级嵌套数组转换为json,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47657596/

相关文章:

python - numpy 除法的问题

javascript - 如何将 JSON 树转换为动态 HTML 表

javascript - 从 Angular Controller 中的 php 文件获取 JSONP 数据

javascript - 如何根据响应代码在延迟后重试 Angular 发布请求

javascript - 如何查找没有日期部分的时间间隔之间的重叠

javascript - 为什么我无法将单击事件添加到动态插入的列表元素?

java - 拆分字符串数组导致数组索引超出范围

objective-c - Objective C 无法处理二维数组.count?

javascript - 切换 div 同时隐藏其他 div

ios - 在 Swift Alamofire 中写入的 JSON 类型无效