Question

我在this example之后创建工具提示。

出于某种原因，当我移动鼠标时，我的工具提示会闪烁。据我了解，mousemove()函数找到最近的数据点;因此只要鼠标位于.overlay矩形上方，工具提示就应该始终显示。

有什么想法吗？这是我的小提琴：

http://jsfiddle.net/samselikoff/zhMQ8/1/

Answer 1

闪烁的发生是因为工具提示有时会出现在鼠标下方并导致 mouseout 被调用并再次移除工具提示并再次将鼠标移到元素上，因此 mouseover 是呼叫，循环继续......

有一点差距（我添加了5个），所以工具提示不会出现在鼠标下面：

tooltip.attr("transform", "translate(" + (xScale(d.date)   + 5  ) + ",0)");

修改避免影响鼠标的工具提示的另一种可能更好的方法是给它造型：

pointer-events: none;

Answer 2

我认为，mouseover / mouseout在他们不需要的时候连续开火：

更新小提琴（再次）：http://jsfiddle.net/zhMQ8/3/

g.on("mouseover", function() { tooltip.style("display", null); });

g.on("mouseout", function() { tooltip.style("display", "none"); });

g.select(".overlay").on("mousemove", mousemove);

Answer 3

发现如果工具提示超出表单会导致此问题。从屏幕边缘向内移动工具提示或缩短工具提示文本。

Answer 4

不要使用mousemove属性。使用鼠标悬停。

    private void pboxLabExam_MouseHover(object sender, EventArgs e)
    {
        toolTip1.SetToolTip(pboxLabExamGlow, "LABORATORY EXAM"); //<---
    }

为什么我的工具提示会闪烁？

4 个答案: