使用Chart.js,如何避免工具提示重叠?

时间:2017-02-19 17:31:33

标签: javascript angularjs chart.js

我通过Chart.js使用Angular Char。我已经显示了所有工具提示,以便通过创建plugin下载包含所显示信息的图表。

工具提示重叠,似乎没有任何逻辑来分发它们以便它们不会。有没有办法做到这一点?

一些插件代码。这对我的问题并不重要。 'beforeRender'函数为数据集中的每个项创建一个新的Chart.Tooltip,afterDraw呈现它们:

// turn on tooltips
chart.options.tooltips.enabled = true;
Chart.helpers.each(chart.pluginTooltips, function (tooltip) {
tooltip.initialize();
tooltip.update();
// we don't actually need this since we are not animating tooltips
tooltip.pivot();
tooltip.transition(easing).draw();

图表: enter image description here

1 个答案:

答案 0 :(得分:1)

您可以使用以下代码片段实现一些重叠解决方案:

tooltips: {
    mode: 'index',
    intersect: false,
    yPadding: 2,
    xPadding: 2,
    caretSize: 0,
    borderWidth: 0,
}