d3.js 如何通过将标题更改为类别并将所有值更改为一列来读取多列CSV?

iaqfqrcu  于 2022-11-12  发布在  其他
关注(0)|答案(1)|浏览(90)

我想在d3.js中创建一个多行图表,数据以csv格式保存,组织如下:

¦Date      ¦ Cat A¦ Cat B¦ Cat C¦  
¦:---------¦:----:¦:----:¦-----:¦  
¦2019-12-01¦2     ¦6     ¦9     ¦  
¦2018-11-02¦4     ¦4     ¦20    ¦

如何读取要排列成三列的数据:

¦Date      ¦ Category¦ value ¦  
¦:---------¦:-------:¦------:¦  
¦2019-12-01¦CAT A    ¦2      ¦  
¦2018-11-02¦CAT A    ¦4      ¦  
¦2019-12-01¦CAT B    ¦6      ¦  
¦2018-11-02¦CAT B    ¦9      ¦

请注意,我想忽略其中一列(CAT C)

hc8w905p

hc8w905p1#

通常在D3中,导入扁平化的数据,然后相应地分组或嵌套它。这意味着(据我所知)执行相反操作的工具并不那么自然。在这种情况下,使用vanilla Javascript可能是简单易懂的:

const data = [
        { Date: '2019-12-01', 'A' : 2, 'B' : 6, 'C' : 9  }, 
        { Date: '2018-11-02', 'A' : 4, 'B' : 4, 'C' : 20 }
    ];

    console.log(data)

    result = [];

    data.forEach(row => {
                 let a = (({ Date, A, B, C }) => ({ Date, A}))(row);
                 result.push(a)
                 let b = (({ Date, A, B, C }) => ({ Date, B}))(row);
                 result.push(b)
                 });
    console.log(result);

相关问题