[英]How to resize bar graph in c3.js
我想使c3.js图小于现在的实际值。 我玩的是宽度,但如果不是620,它将截去较大的值。
红色图形为620像素。 我希望它是第一个图形的大小,所有值都显示而没有任何淡入/截止。
var chart = c3
.generate({
bindto : "#topSources",
size : {
height : 180,
width : 620
},
bar : {
width : 16
},
padding : {
right : 230,
top : 50
},
color : {
pattern : [ '#008000', '#008000', '#008000', '#008000',
'#008000' ]
},
data : {
columns : [ [ 'Throughput', data.columns[0][1],
data.columns[0][2], data.columns[0][3],
data.columns[0][4], data.columns[0][5] ] ],
type : 'bar',
labels : {
format : {
Throughput : d3.format('$'),
}
},
color : function(inColor, data) {
var colors = [ '#008000', '#008000', '#008000',
'#008000', '#008000' ];
if (data.index !== undefined) {
return colors[data.index];
}
return inColor;
}
},
axis : {
rotated : true,
x : {
type : 'category',
show : false,
},
y : {
show : false
}
},
tooltip : {
grouped : false
},
legend : {
show : false
}
});
设置轴填充的值(本例中y轴的底部,因为它是旋转的条形图)。 80px将覆盖您标签的大部分长度-如果您更改字体大小等,则需要不同
axis : {
...
y : {
show : false,
padding: { // use these 3 lines
bottom: 80,
},
}
},
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.