렌더링 릿 기능을 수행 한 후에 만 ​​DC 막대 차트를 표시하고 렌더하지 않습니다.

Question

attr을 사용하여 막대 크기와 위치를 수정합니다. 그러나 차트 속성은 차트가 렌더링 된 후에 만 ​​사용할 수 있습니다.

그래서 나는 fuction에서 수정을하고 있습니다. chart.on ("renderlet.somename", function (chart) {// modification});

내 문제는 차트가 처음 렌더링 된 다음 수정 사항이 적용되고 모두 페이지에 표시되므로 이상하게 보입니다.

변경 사항이 적용된 후에 만 ​​차트가 표시되기를 원합니다.

Answer 1

pretransition event을 사용할 수 있다고 작성하기 시작했습니다. 전환이 시작되기 전에 모든 항목이 렌더링/다시 그려진 후에 발생하기 때문입니다.

바 너비가 공개적으로 액세스 할 수 없다는 것은 맞습니다 (바뀌어야합니다!). 전환 될 때까지 바에서 읽을 수 없습니다. ,

chart.on('renderlet', function(chart) { 
    d3.select('div#test').style('visibility', 'visible'); 

일시 정지를 제거하려면 : 당신이 제안

그래서, 대신 CSS를 사용하여 전체 차트를 숨길 수 :

<div id="test" style="visibility: hidden"></div> 

을 다음 renderlet의 시작을 보여 초기화 할 때이 차트의 전환을 비활성화 할 수도 있습니다.

chart 
    .transitionDuration(0) 

그리고 당신의 renderlet에서 그들을 다시 활성화 : http://jsfiddle.net/gordonwoodhull/cw86goxy/32/

: 여기

chart 
    .on('renderlet', function(chart) { 
    d3.select('div#test').style('visibility', 'visible'); 
    chart.transitionDuration(750); // default value 

(또한 바의 폭을 필요로) 오차 막대를 보여주는 바이올린을 사용하여 데모입니다