如何使用 jQuery Flot 将工具提示添加到轴标签答案

【问题标题】：How to add tooltip to axis label with jQuery Flot如何使用 jQuery Flot 将工具提示添加到轴标签
【发布时间】：2018-01-18 18:26:24
【问题描述】：

我已经用 jQuery Flot 创建了浮点图，但是现在，我在 x 轴上有很长的标签，并且在字符串的末尾用 ... 截断了。

我需要在 x 轴标签上添加一个工具提示才能看到完整的标签。

我已附上截图。

或者有没有办法自定义渲染轴标签（HTML）？

谢谢

【问题讨论】：

我已通过在刻度选项中传递 HTML 字符串来修复此添加。

标签： javascript jquery charts flot

【解决方案1】：

类似问题已经回答：Mark 在Question

这里尝试使用您的 CSS 并进行一些动态调整，以使事情适合：

// push the labels down half their width
// while we are at it find longest label height
var longest = -1;
$('#flot_chart .xAxis .tickLabel').each(function(){
   var self = $(this);
   var width = self.width();
   self.css('top',parseInt(self.css('top')) + width/2 - 5);
    if (width > longest){
        longest = width;
    }
});

// now adjust the chart height so we don't overflow
$("#flot_chart").height($("#flot_chart").height() + longest - $('#flot_chart .xAxis .tickLabel').height() + 5);

JSFiddle

【讨论】：

【解决方案2】：

我已通过在刻度选项中传递 HTML 字符串来修复此添加。

JQuery Flot 在 float-x#-label 容器中注入 HTML 字符串。

【讨论】：