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 옵션에서 직접 설정할 수는 없지만 차트가 렌더링 된 후에이 값을 수정할 수 있습니다."파이"가 원형 차트를 렌더링 한 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으로 설정합니다.