#javascript #json #c3.js
#javascript #json #c3.js
Вопрос:
У меня есть линейный график, созданный с помощью c3.js с данными json
текущая диаграмма очень проста
var chart = c3.generate({
bindto: '.balanceChart',
data: {
url: '/data',
mimeType:'json'
}
});
данные json:
{
data1: [1000,1240,1270,1250,1280]
data2: [1000,240,30,-20,30]
}
диаграмма выглядит хорошо и есть
, но в настоящее время она отображает оба набора данных
. я бы хотел, чтобы data2 был значением всплывающей подсказки для графика
Ответ №1:
Вы можете скрыть data2 от отображения следующим образом
data: {
...
hide: ['data2']
}
Из http://c3js.org/reference.html#data-hide
И используйте tooltip.format.value для изменения отображения всплывающей подсказки
tooltip: {
format: {
value: function (value, ratio, id, index) {
// return chart.data.values("data2")[index]; // if still wanting to use data2
// or get rid of data2 completely using this
var vals = chart.data.values(id); // id will be 'data1', vals will then be data1 array
return vals[index] - (index === 0 ? 0 : vals[index - 1]);
}
}
}
http://c3js.org/reference.html#tooltip-format-value
tooltip.format.title и tooltip.format.name здесь также будет полезно сообщить пользователю, что значение на самом деле не соответствует значению data1 (возможно, просто изменив заголовок на «Delta Data1»)
Комментарии:
1. ну, я не получаю никаких ошибок, но у меня также нет всплывающих подсказок
2. упс, нажмите enter для новой строки с тех пор, как я начал использовать URL для получения своих данных json, у меня вообще нет всплывающих подсказок, какие-либо идеи?
3. мой плохой, по какой-то причине у меня была диаграмма внутри диапазона вместо div, большое вам спасибо за помощь, она работает отлично, очень ценится