area-single.html

<div id="{{include.id}}" class="line-chart-pf"></div>
<script>
  var areaChartDataColumns = [
    ['data1', 350, 400, 350, 0],
    ['data2', 140, 100, 150, 205, 145, 50],
    ['data3', 10, 60, 90, 10, 325, 400],
    ['data4', 260, 10, 305, 100, 50, 150]
  ];
  var singleAreaChartDataColumns = [
    ['data2', 140, 100, 150, 205, 145, 50]
  ];

  var c3ChartDefaults = $().c3ChartDefaults();
  var singleAreaChartConfig = c3ChartDefaults.getDefaultSingleAreaConfig();
  singleAreaChartConfig.bindto = '#{{include.id}}';
  singleAreaChartConfig.data = {
    columns: singleAreaChartDataColumns,
    type: 'area-spline'
  };
  var singleAreaChart = c3.generate(singleAreaChartConfig);
</script>