Question

我有代码，我从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
        .....

Answer 1

在这种情况下，您需要一些自定义数据格式。您可以在下面找到以前提供给我们的.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;
}

以下是此代码构建的图表的屏幕截图。

使用javascript

1 个答案: