NVD3 TooltipContent不起作用

我正在为我的项目使用NVD3库，并且我已经编写了以下代码。NVD3 TooltipContent不起作用

var chart = nv.models.lineChart() 
      .useInteractiveGuideline(true) 
      .margin({top: 50, right: 50, bottom: 50, left: 50}) 
      .tooltipContent(function (key, y, e, graph) { 
       console.log("helo"); 
       return "hello"; 
      });

预期的输出应该是在鼠标显示打招呼。但我不明白，而是我得到了默认的工具提示。

请让我知道我正在做的错误。

来源

2014-10-19 Jayendra Gothi

[nvd3饼图的可能重复。 js - 如何编辑工具提示？]（http://stackoverflow.com/questions/12416508/nvd3-piechart-js-how-to-edit-the-t ooltip） – shabeer90 2014-10-20 11:09:49

我现在把它弄了.useInteractiveGuideline（true）是不正确的。它应该是.useInteractiveGuideline（false）。由于定制工具提示不能与用户2612936建议的“useInteractiveGuideline”一起存在，请访问http://stackoverflow.com/questions/12416508/nvd3-piechart-js-how-to-edit-the-tooltip – 2014-10-21 08:08:55

感谢shabeer90引导到正确的帖子。 – 2014-10-21 08:09:44

请问您可以为它创建一个小提琴或plunkr吗？下面是实现我们的项目代码，它返回一个HTML元素的作品还有：

.tooltipContent(function (key, x, y, e) { 
          if (e.value >= 0) { 
           return '<h3>' + key + '</h3>' + 
            '<p>' + y + ' at ' + x + '</p>'; 
          } else { 
           return ''; 
          } 
         });

来源

2014-10-20 05:56:49

它现在可以有互动准则的1.8.1版本（https://github.com/novus/nvd3/tree/v1.8.1-alpha）自定义内容。

chart.interactiveLayer.tooltip.contentGenerator(function(data) { 
    return 'this is my custom content'; 
});

来源

2015-03-12 00:09:43 Pim

是的..这工作正常..谢谢 – 2015-07-15 22:31:29

适合我。谢谢。 – 2015-07-28 20:25:11

谢谢。这也适用于angular-nvd3。内容发生器：函数（数据）{ console.log（'tooltip'，data）; } } }' – 2016-09-02 07:02:30

与nvd3版本开始1.8+使用的方法chart.tooltip.contentGenerator() 代替.tooltipContent()

例如：

chart.tooltip.contentGenerator(function(data) { 
     return '<p>' + data.point.x + '</p>' 
    }

这里更多信息 - https://github.com/novus/nvd3/issues/1359

来源

2016-10-06 17:26:53

NVD3 TooltipContent不起作用

回答

相关问题