时间戳

首页 > 解决方案 > 如何使用 crossfilter 和 dc.js 开发分组堆栈条形图

dc.js - 如何使用 crossfilter 和 dc.js 开发分组堆栈条形图

问题描述

分组堆积条形图（示例） 

stackedbarchart.width(460)
                .height(250)
                .margins({top: 5, right: 5, bottom: 20, left: 10})
                .dimension(stackedbarchartDimension)
                .group(stackedbarchartGroup)
                .stack(stackedbarchartGroup_stack)
                .stack(stackedbarchartGroup_stack2)
                .x(d3.scale.ordinal())
                .xUnits(dc.units.ordinal)

请使用 dc.js 发布“分组堆积条形图”的任何工作示例。

标签： dc.jscrossfilter

解决方案

这还不是核心库的一部分，但是您可以使用一个活动的拉取请求：

https://github.com/dc-js/dc.js/pull/1459

分支上有构建版本，所以如果你使用npm，你可以指定依赖

"dc": "git://github.com/dc-js/dc.js.git#grouped-stacked-3",

或者只是克隆 repo 并使用grouped-stacked-3分支。

该分支包含以下示例：

web/examples/bar-grouped-multi.html
web/examples/bar-grouped.html

编辑：这很疯狂，我看到它仍然没有分组+堆叠条的示例。我会看看我能不能解决这个问题；在那之前，我认为这个 plunkr是最好的例子

分组堆叠

推荐阅读