nvd3 범례가 중복 됨

Question

내 데이터에 올바르게 렌더링 된 두 개의 커브가 포함되어 있지만 두 번째 색칠 된 점과 텍스트가 부분적으로 첫 번째 텍스트와 겹치도록 범례가 겹칩니다. 두 점 중 하나를 클릭하여 곡선을 숨기면 오버랩이 즉시 해결되고 반환되지 않습니다.

아래 코드. 한 페이지에 여러 개가 있습니다. xAxis 행을 생략하면 분명한 연결은 없지만 문제가 해결됩니다.

d3.json('project_x_data.json', function(data) { 
    nv.addGraph(function() { 
    var chart = nv.models.lineChart() 
        .x(function(d) { return d[0] }) 
        .y(function(d) { return d[1] }) 
        .clipEdge(true); 

    chart.xAxis.axisLabel('').tickFormat(function(d){ 
    return d3.time.format('%d/%m/%y')(new Date(d*1000)) }); 

    d3.select('#chart-project_x_data svg').datum(data) 
    .call(chart); 

    nv.utils.windowResize(chart.update); 
    return chart; 
    }); 
}); 

Versions :: Browsers : Firefox, Chrome, Ubuntu 및 OSX. novus/nvd3 latest 및 Advael의 현재 병합에 대한 동일한 동작. 차트가 페이지가로드 기본적으로 표시되지 않는 부트 스트랩 탭에 포함되어

편집 .... 탭을 선택하면 (차트가 표시됨) 브라우저 창의 크기를 조정할 때 범례가 올바르게 수정됩니다. 탭이 이 아니고 (차트가 숨김)으로 선택되었을 때 브라우저 창의 크기를 조정할 때 다음을 선택하면 범례가 스스로 수정되지 않았습니다. 차트가 너무 단순하기 때문에 차트가 숨겨져있는 동안 렌더링이 완료되는 것 같습니다.

어떤 생각을 불러 일으키는 데 도움이됩니까?

Answer 1

이것은 더 이상 문제가되지 않습니다.

이제 탭이 표시되었을 때만 Ajax를 사용하여 그래프를 렌더링합니다. 결과를 신뢰할 수 있고 반복 할 수있을 정도로 충분합니다.