Show/hide and customize labels:true for combined charts

[gopeter]

It would be great, if labels: true can be configured for combined charts (http://c3js.org/samples/data_label.html).

Example: I have a combined chart with bars and and an area. Now I want to show the values of the area only (and customize it: the value shown should have a trailing "%").

[masayuki0812]

Hi @gopeter , I totally agree and I'll add this feature. Please give me some time.

[gopeter]

Great, thank you!
A (related?) question: is it possible to swap both y-axis? My data object looks like

data: {
  x : 'x',
  columns: chartData,
  type: 'bar',
  types: {
    progress: 'area'
  },
  axes: {
    progress: 'y2'
  },
  labels: true,
  groups: [
    ['done', 'in progress', 'on hold', 'problem', 'soon']
  ]
},

and I want to display the grouped paramters on the top and the progress at the bottom (axis: { rotated: true })

Is there a way to show the grouped data on y2?

[masayuki0812]

Sorry, currently it is not possible to swap the axes and I think it is possible to show stacked bars on y2 by setting data.axes. However, something wrong with bar stack on y2 when loading data. I'll fix.

[masayuki0812]

Hi @gopeter , for labeling issue, I think now you can do that by setting options like this:

data: {
...
  labels: {
    format: {
      y: function () { return ""; },
      y2: function (v) { return v + "%"; }
    }
//  or 
//  format: function (v, id) { return id === 'progress' ? v + "%" : ""; }
  }
...
}

Could you try this on the latest code including the commit above?

[gopeter]

Thank you, works great!

[masayuki0812]

Hi @gopeter , Sorry, bars can be stacked based on y2 axis by setting data.axes properly. I mean if the bar of data1, data2 and data3 needs to be stack, please set data.axes for all of these. If another data would be loaded, please set data.axes in advance (I think some args of load() would be needed to specify the axis that loading data relates to).
Could you try this solution?

[gopeter]

Thanks, works great!