DC.js 中的 PieChart 与 Queue.js 不工作答案

【问题标题】：PieChart in DC.js with Queue.js not workingDC.js 中的 PieChart 与 Queue.js 不工作
【发布时间】：2026-01-16 03:25:01
【问题描述】：

这是一个使用 Queue.js 在 dc.js 中加载多个 csv 的示例：https://github.com/dc-js/dc.js/blob/master/web/examples/composite.html

这是我的版本（javascript）：

var composite = dc.compositeChart("#test_composed");
var composite2 = dc.compositeChart("#test_composed2");

var q = queue()
  .defer(d3.csv, "morley.csv")
  .defer(d3.csv, "morley2.csv");

q.await(function(error, exp1, exp2) {

var ndx = crossfilter();
ndx.add(exp1.map(function(d) {
    return {x: d.Run};
}));
ndx.add(exp2.map(function(d) {
    return {x: d.Run};
}));

var dim  = ndx.dimension(dc.pluck('x')),
    grp = dim.group().reduceCount(dc.pluck('x'));  

composite
    .width(768)
    .height(480)
    .x(d3.scale.linear().domain([0,200]))
    .compose([
        dc.barChart(composite)
            .dimension(dim)
            .group(grp)
        ])
    .brushOn(false)
    .render();

composite2
    .width(768)
    .height(480)
    .x(d3.scale.linear().domain([0,200]))
    .compose([
        dc.lineChart(composite2)
            .dimension(dim)
            .group(grp)
        ])
    .brushOn(false)
    .render();    
});

使用相同的数据，应该和附图一样好。

它适用于 lineChart 和 barChart，但不适用于 pieChart、rowChart...

是否有任何类似的饼图工作示例？

谢谢！

【问题讨论】：

在我看来就像一个直接的 dc.js 问题，queue.js 只是一种确保在初始化图表之前加载数据的方法。你能用你的非工作饼图发布一个 jsfiddle 吗？如果您查看饼图示例或 API 参考，您会发现 API 有点不同 - 例如，没有.x()，原因很明显。
@Gordon 你是对的！换成饼图，其实很简单。让我们使用上面的composite2。在正常情况下，我们只需要 1. 删除 .x() 2. 删除 .brushOn() 3. 添加 .radius() 4. 将 lineChart 更改为 pieChart。在使用 Queue.js 之后，它就无法正常工作了...... :( jsfiddle.net/8K66Q

标签： d3.js charts dc.js queue.js

【解决方案1】：

我知道这并不能真正解决您的问题，但我只是让您知道另一种解决方案。谷歌代码游乐场展示了谷歌供开发人员使用的一些很酷的代码。查看这些链接条形图：https://code.google.com/apis/ajax/playground/#bar_chart

【讨论】：

谢谢，但没有帮助:(

【解决方案2】：

感谢您发布 jsfiddle。如果你完成了你的小提琴，我们可以更好地帮助你解决它。 ;-)

看起来您正在尝试使用饼图创建复合图表。这很不寻常——你为什么要这样做？通常，当您想要覆盖不同的图表时，复合是用于您的小提琴中只有一个图表。

我不确定复合图表是否适用于非网格图表。

【讨论】：