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不起作用

回答

相關問題