#javascript #d3.js #c3.js
#javascript #d3.js #c3.js
Вопрос:
Есть какой-то способ установить положение всплывающей подсказки в c3js, потому что всплывающая подсказка всегда находится справа от вертикальной линии, но когда курсор находится на последнем значении, он меняет положение в сторону левой стороны или состояния на графике, не покидая его.
Я знаю, что это нормальное поведение всплывающей подсказки на c3js, но я хочу, чтобы всплывающая подсказка сохраняла свое положение с правой стороны для последнего значения
вы можете увидеть пример по этой ссылке
var chart = c3.generate({
data: {
columns: [
['data1', 300, 350, 300, 0, 0, 0],
['data2', 130, 100, 140, 200, 150, 50]
],
types: {
data1: 'area',
data2: 'area-spline'
}
},
axis: {
y: {
padding: {bottom: 0},
min: 0
},
x: {
padding: {left: 0},
min: 0,
show: false
}
}
});
есть идеи?
Ответ №1:
Вы можете установить положение всплывающей подсказки с помощью этого кода:
http://c3js.org/reference.html#tooltip-position
tooltip: {
position: function (data, width, height, element) {
var top = d3.mouse(element)[1] 15;
return {top: top, left: parseInt(element.getAttribute('x')) parseInt(element.getAttribute('width'))}
}
}
Однако, как это работает, когда всплывающая подсказка выходит за пределы графика, я не знаю, возможно, это просто обрезание. Я полагаю, вы могли бы добавить поле в 100 пикселей справа, если это необходимо, но это сделает вашу диаграмму меньше.