dc.js piechart设置特定的x轴值

Question

我正在研究dc.js，我绘制piechart

pieChart.width(300)
    .height(200)
    .transitionDuration(1500)
    .dimension(startValue)
    .group(startValueGroup, "StartValue")
    .radius(100)
    .minAngleForLabel(0.5)
    .legend(dc.legend().x(230).y(0))
    .title(function(d) {
        return d.key + ": " + d.value;
    })
    .renderTitle(true)
    .on("filtered", function (chart) {
        dc.events.trigger(function () {
            //console.log(total_payment);
            });
    });

.

现在，我想设置特定的x轴值。目前，PieChart采用宽度和高度的中心位置。这意味着它的位置（150,100）。我想将这个位置改为（100,100）。

如何根据上面的代码更改X轴的位置？

Answer 1

您无法在DC选项中直接设置此项，但您可以在呈现图表后修改这些值。假设“pie”是您将饼图呈现为饼图的DOM元素的ID，您可以执行

d3.select("#pie > svg > g").attr("transform", "translate(100,100)");

.

Answer 2

我知道这是一个旧的帖子，答案完美地工作，但是当图表是更大的系统（几个图表）的一部分时，我发现更容易将上面的命令直接添加到图表中：

pieChart.on('renderlet', function (chart) {
    chart.select("svg > g").attr("transform", "translate("100,100)");
});

.

编辑：

实际上我刚刚发现你可以做到的：

.cx(100)
.cy(100)

.

将在渲染之前将饼图的中心设置为100,100。