Bootstrap Tooltip跟随动画元素

Question

我有一个类似于this的D3.js图表​​。当用户深入到图表中时，我利用引导工具提示来显示节点名称。我正在通过反复调用工具提示show方法来跟踪节点，这会导致工具提示在新位置重新渲染。

setInterval(function(){
        $(node).tooltip('show');
    }, 100) 

我担心的是，调用此函数会导致性能问题。任何人都可以建议一种更好的方法来实现这一点，或者以这种方式使用setInterval函数时对性能问题给出一些见解？

Answer 1

从您的描述中听起来，通过倾听状态而不是时间的离散变化，可以更好地完成您尝试做的事情。我还没与D3.js合作过，但即使只是听取点击<circle>元素这样简单的事情也会更有效率。

JS

$('svg').on('click', 'circle', function () {
  $(node).tooltip('show')
})

看起来像D3.js has it's own event framework，但我不确定它是否支持委派。更熟悉的人可能会为此提供更好的建议。

最后，根据您一次显示的节点数量，在所有上调用工具提示显示本身可能会产生性能损失。通过存储引用来跟踪每次打开和关闭哪些打开和关闭可能更有效。同样， D3.js 中可能还有一些东西可以解决这个问题，但这不是我所知道的。