C3JS获取X轴上显示的值

Question

我有这样简单的条形图：

这是我的C3JS

var chart = c3.generate({
data: {
json:[{"A": 67, "B": 10, "site": "Google", "C": 12}, {"A": 10, "B": 20, "site": "Amazon", "C": 12}, {"A": 25, "B": 10, "site": "Stackoverflow", "C": 8}, {"A": 20, "B": 22, "site": "Yahoo", "C": 12}, {"A": 76, "B": 30, "site": "eBay", "C": 9}],
        mimeType: 'json',
    	keys: {
        	x: 'site',
        	value: ['A','B','C']
    	},
    	type: 'bar',
  			selection: {
			enabled: true
  			},
    	onselected: function(d,element)
    	{   
    		alert('selected x: '+chart.selected()[0].x+' value: '+chart.selected()[0].value+' name: '+chart.selected()[0].name);
    	},
    	groups: [
        	['A','B','C']
    	]
	},
	axis: {
    	x: {
	type: 'category'
        }
      }
});

选择（单击）某个图表元素后，警报会显示第一个选定元素的X和值以及名称属性。例如，在我点击左上图表元素后，“选中x：0值：67名称：A”。如何在X轴上显示值？在这种情况下，它是“谷歌”。

Answer 1

当x轴被声明为类型类别时，将填充属性类别，就像在这种情况下一样。因此，要从x轴获取数据，您需要调用.categories（）函数。

onselected: function(d,element){alert(chart.categories()[d.index]);}

https://jsfiddle.net/4bos2qzx/1/