在FLOT图中自定义工具提示

我正在使用FLOT来显示图表。

要显示tootip我正在使用https://github.com/krzysu/flot.tooltip 。

现在我想自定义工具提示的内容，所以我使用回调来设置工具提示的内容。 代码段：

tooltip: true, tooltipOpts: { content: function(label, xval, yval, flotItem){ var xAxis = plot.getXAxes(); return xval; }, defaultTheme: false } 

但它给了我错误

 caught TypeError: Object function (label, xval, yval, flotItem){ var xAxis = plot.getXAxes(); return xval; } has no method 'replace' 

任何人都可以帮助我吗？

提前致谢。

Answer 1

我没有使用flot工具提示。 有更简单的方法来显示工具提示并自定义它。 看看这个小提琴手：

http://jsfiddle.net/Margo/yKG7X/5/

$（“＃placeholder”）。bind（“plothover”，function（event，pos，item）{if（item）{
$（ “＃提示”），删除（）。

  var x = item.datapoint[0], y = item.datapoint[1]; showTooltip(item.pageX, item.pageY, x + " / " + y ); } }); 

 function showTooltip(x, y, contents) { $('
' + contents + '
').css({ position: 'absolute', display: 'none', top: y + 5, left: x + 5, border: '1px solid #fdd', padding: '2px', 'background-color': '#fee', opacity: 0.80 }).appendTo("body").fadeIn(200).fadeOut(6000); } 

希望能帮助到你 ：）

Answer 2

文件说明：

如果您需要更多地控制工具提示的生成方式，则可以传递必须返回具有所述格式的字符串的回调函数（label，xval，yval，flotItem）。

xval是工具提示所在的数字 x轴值。 它不是一个字符串。 它失败的replace方法是标准的string.replace：

  > "".replace function replace() { [native code] }