Диаграммы C3 не хотят, чтобы на оси Y были обозначены цифры
Как вы можете видеть в выводе, я получаю десятичные значения по оси Y. Количество скачиваний не может быть 1,5.
Я пытался дать минимальное значение, но не смог получить результат.
Также при наведении указателя мыши на сетку я всегда получаю значение ноль 0(над изображением Microsoft). Могу ли я иметь свой собственный текст там?
function draw_tech_chart(){
var chart = c3.generate({
bindto: "#tech_chart",
data: {
columns: [['Microsoft', 5],['WebApplicationDevelopment', 2],['OpenSource', 2],['Content Management ', 2],['Open Source Middleware', 1],],
type : 'bar',
onclick: function (d, i) { console.log("onclick", d, i); },
onmouseover: function (d, i) { console.log("onmouseover", d, i); },
onmouseout: function (d, i) { console.log("onmouseout", d, i); }
},size: {
height: 250
}
});
2 ответа
Просто отформатируйте галочки у, чтобы не отображать метки
var chart = c3.generate({
bindto: "#tech_chart",
...
axis: {
y: {
tick: {
format: function (d) {
return (parseInt(d) == d) ? d : null;
}
}
}
}
});
В качестве альтернативы, вы также можете перебирать значения, находить max и устанавливать значения y tick вручную на целые числа или кратные целые числа от 0 до max+ (см. http://c3js.org/reference.html)
Скрипка - http://jsfiddle.net/ovvywb5j/
Вам просто нужно вручную вычислить значения по оси Y. Вы также можете отформатировать заголовок всплывающей подсказки:
axis: {
y: {
tick : {values: [0,1,2,3,4,5]}
}
}, tooltip: {
format: {
title: function (d) { return 'Custom text'; },
}
}
Скрипка: http://jsfiddle.net/yymcjhgv/