javascript - 在嵌套 JSON 上使用 dc.js 创建条形图

Question

我正在尝试使用 dc.js 和 crossfilter 按角色数量创建一个条形图。需要处理嵌套的JSON。

示例数据集

 [      {  "user":"Mani"
            "age":55,
            "area":"NORTH",
            "role": [
                {
                    "roleId": 15,
                    "role": "Operator",
                    "at": "2018-10-30T07:53:10.433Z",
                    "createdAt": "2018-10-30T07:53:10.449Z"

                },
                {
                    "statusId": 16,
                    "status": "Supervisor",
                    "at": "2018-10-30T07:53:18.359Z",
                    "createdAt": "2018-10-30T07:53:18.359Z"

                },
                {
                    "statusId": 26,
                    "status": "Manager",
                    "at": "2018-10-30T13:01:50.296Z",
                    "createdAt": "2018-10-30T13:01:50.296Z"

                }
                ]
        },  {
            "user":"Kandan"
            "age":65,
             "area":"SOUTH",
            "role": [
                {
                    "roleId": 15,
                    "role": "Operator",
                    "at": "2018-10-30T07:53:10.433Z",
                    "createdAt": "2018-10-30T07:53:10.449Z"

                },
                {
                    "statusId": 16,
                    "status": "Supervisor",
                    "at": "2018-10-30T07:53:18.359Z",
                    "createdAt": "2018-10-30T07:53:18.359Z"

                }
                ]
        }
]

我尝试使用每个用户根级别的值创建图表，但是当我尝试访问 role 键时，我不知何故只能使用一个角色，而不是另一方面的所有角色将数组返回到维度。基本思想是 x 轴下有 role.role ，y 轴上有它们的计数。我如何实现这一目标？

示例输出

Answer 1

您的问题并不是真正的嵌套 JSON；而是事实上，每个用户都有多个角色。

要获取每个用户的角色，您可以使用返回角色名称数组的访问器:

var roleDimension = cf.dimension(d => d.role.map(r => r.role), true);

第二个参数指定您想要 "tag" or "array" dimension 。这是一种特殊模式，其中每行将被计算多次，对于维度键访问器返回的数组中的每个标签一次。

我看到您想将其用于条形图，这很好 - don't use this for any chart which implicitly adds up to 100%!由于类别并不相互排斥，因此即使您小心翼翼地不暗示 100%，行为也可能会令人困惑。