title: How to show c3.js No data but with legend for empty column?
body: <p>I have managed to display "No data available message" on my chart. But trouble is that I want to show legend with data name even when there is no data. </p>
  
  <p>If the values are null, the "No data" message will disappear. If there is no data, message will appear but legend will disappear. </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var chart = c3.generate({
    data: {
      bindto: "#chart",
      x: 'x',
      columns: [
        ['x', '2013-01-01', '2013-01-02', '2013-01-03', '2013-01-04', '2013-01-05', '2013-01-06'],
        //Uncomment to see the legend ['data1', null, null, null, null, null, null] 
        ['data1'] //Comment out to see the legend
      ],
      empty: {
        label: {
          text: "No Data Available"
        }
      }
    },
    axis: {
      x: {
        type: 'timeseries',
        tick: {
          format: '%Y-%m-%d'
        }
      }
    }
  });
  chart.load({});</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"&gt;&lt;/script&gt;
  &lt;link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.css" rel="stylesheet" /&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.js"&gt;&lt;/script&gt;
  &lt;div id='chart'&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>