我刚刚开始使用c3.js,我还没弄明白如何在x轴上指定刻度值.值为type1,type2,type3 ……这是我的代码:
$(document).ready(function(){
var mammoReconstructionsAcceptedChart = c3.generate({
bindto: '#mammo_reconstructions_accepted',
data: {
x: 'x',
columns: [
['x', 'type1', 'type2', 'type3', 'type4', 'type5', 'type6'],
['data1', 30, 200, 100, 400, 150, 250]
]
},
axis: {
x: {
tick: { format: d3.format("") }
}
}
});
});
解决方法:
这完全没问题.我基于C3.js网站上的Category Axis Example.
$(document).ready(function() {
var mammoReconstructionsAcceptedChart = c3.generate({
bindto: '#mammo_reconstructions_accepted',
data: {
columns: [
['data1', 30, 200, 100, 400, 150, 250]
]
},
axis: {
x: {
type: 'category',
categories: ['type1', 'type2', 'type3', 'type4', 'type5', 'type6']
}
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css" rel="stylesheet" />
<div id="mammo_reconstructions_accepted"></div>