Bar Chart: Tooltip Each Bar
jonnjasperejoc opened this issue · comments
This is not an issue but I just want to share this, In Bar Chart I wanted each bar to have it's own tooltip, this is what I did. Hope this will help others too.
and here's the code
var chart = c3.generate({ data: { columns: [ ['A', 120, null, null, null, null, null, null, null, null], ['B', null, 30, null, null, null, null, null, null, null], ['C', null, null, 100, null, null, null, null, null, null], ['D', null, null, null, 76, null, null, null, null, null], ['E', null, null, null, null, 50, null, null, null, null, null], ['F', null, null, null, null, null, 45, null, null, null, null], ['G', null, null, null, null, null, null, 80, null, null, null], ['H', null, null, null, null, null, null, null, 23, null, null], ['I', null, null, null, null, null, null, null, null, 10, null], ['J', null, null, null, null, null, null, null, null, null, 89] ], groups: [ ['A', 'B', 'C', 'D', 'E', 'F','G','H','I','J'] ], type: 'bar' }, bar: { width: { ratio: .5 // this makes bar width 50% of length between ticks } }, axis: { x: { type: 'category', categories: ['A', 'B', 'C', 'D', 'E', 'F','G','H','I','J'] } }, legend: { show: false }, tooltip: { format: { title: function (x, index) { return 'Jan 19 ' } } } });
This is not an issue but I just wanted to share this.