title: How to show No Data available on load function of c3 JS chart
body: <p>I am making a chart with data initially, but again if data is not available in the chart on load function it is not showing no data available string.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var chart = c3.generate({
   bindto: '#chart1',   
   data: {
          columns: [
              ['data1', -30, 200, 200, 400, -150, 250],
              ['data2', 130, 100, -100, 200, -150, 50]
          ],
          type: 'bar',
          groups: [
              ['data1', 'data2']
          ],
          empty: { label: { text: "No Data Available" }   }
      },
      grid: {
          y: {
              lines: [{value:0}]
          }
      }
  });
  
  
  setTimeout(function () {
  
      chart.load({
          columns: [
          
          
          ],
          empty: { label: { text: "No Data Available" }   }
      });
      chart.flush();
  }, 1500);</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://rawgit.com/masayuki0812/c3/master/c3.css" rel="stylesheet"/&gt;
  &lt;script src="https://rawgit.com/masayuki0812/c3/master/c3.js"&gt;&lt;/script&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"&gt;&lt;/script&gt;
  &lt;div id="chart1"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>How to show no Data available on load function ? </p>