2017-10-17 14 views
0

데이터를 기반으로 차트를 표시하고 있습니다. 데이터를 사용할 수없는 경우에는보기가 좋지 않은 빈 차트가 표시됩니다. 그래서 c3.js에서 데이터 옵션을 사용하지 않고 있지만 어떻게 든 작동하지 않습니다.C3.js 데이터 없음 옵션 표시 안 함

function chartGenerator(chartId,measuresArray,dimensionArray,xLabel,chartType,criteria) 
     { 
      var chart = c3.generate({ 

       bindto : chartId, 
       data: { 
        columns: measuresArray, 
        type: chartType, 
       empty: { 
          label: { 
           text: "No Data Available" 
          } 
         }, 
        labels: true, 
        rotate: 75, 
        onclick: function(e) { 
         /* alert(e.value); */ 
         //make all the bar opacity 0.1 
         d3.selectAll(".c3-shape").style("opacity",0.3); 
         var k = ".c3-shape-"+ e.index; 
         //make the clicked bar opacity 1 
         d3.selectAll(k).style("opacity",1) 
       d3.select('#'+criteria).property('value', "'"+dimensionArray[e.index]+"'"); 
         changeChartView(); 
         } 
       }, 

       bar: { 
        width: { 
         ratio: 0.25 // this makes bar width 50% of length between ticks 
        } 
       }, 

       axis : { 
        x : { 
         type : 'category', 
         categories : dimensionArray, 
         label : xLabel 
        }, 
       y : { 
        label : "Incident Count" 
       } 
       } 
      }); 
     } 

이에서 ... 도와주세요 ...

답변

0

c3.generate({ 
 
\t bindto: '#chart', 
 
    data: { 
 
\t \t columns: [ 
 
\t \t ], 
 
    empty: { 
 
    \t \t label: { 
 
     text: "No Data :(" 
 
     } 
 
    } 
 
    } 
 
});
.c3-chart-lines .c3-shapes { 
 
    pointer-events: all !important; 
 
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script> 
 
<link href="https://rawgit.com/masayuki0812/c3/master/c3.css" rel="stylesheet"/> 
 
<script src="https://rawgit.com/masayuki0812/c3/master/c3.js"></script> 
 

 
<div id="chart"></div>

이이 c3.js에 empty.label.text를 사용하는 간단한 예입니다 ...