부트 스트랩 4 아코디언 카드에서 C3 그래프 오버 플로우

Question

부트 스트랩 아코디언 구성 요소에 c3 그래프를 삽입하려고합니다. 활성화 된 카드 그래프는 좋아 보이지만, 카드를 펼치면 그래프의 오른쪽 가장자리가 카드 가장자리 위로 이동합니다. 카드 2

내가 카드의 확장에 다시 렌더링하는 C3에 전달해야하는 업데이트 이벤트가 있습니까?

JSFiddle

<div class="card"> 
    <div class="card-header" role="tab" id="headingTwo"> 
     <h5 class="mb-0"> 
      <a class="collapsed" data-toggle="collapse" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> 
       Card 2 
      </a> 
     </h5> 
    </div> 
    <div id="collapseTwo" class="collapse" role="tabpanel" aria-labelledby="headingTwo" data-parent="#accordion"> 
     <div class="card-body pl-0"> 
      <div id="chart2"></div> 
     </div> 
    </div> 
</div> 

Answer 1

한 가지 가능한 솔루션이 방법의 붕괴 요소를

 $('#accordion').on('shown.bs.collapse', function (e) { 
      chart1.flush(); 
      chart2.flush(); 
     }) 

단점을 보여주는 차트를 플러시하는 것입니다 업데이트가 없습니다 너무 부드럽고입니다, 당신은 차트의 크기를 볼 수 있습니다 붕괴시 점프.