在firefox,IE中d3上的糊涂工具提示定位

Question

我正在绘制d3线图和附在圆圈上的醉意工具提示.

工具提示在Chrome/Safari中运行良好,但是当你将鼠标悬停在一个点上时,在Firefox和IE中,当相应的工具提示出现时,它会显示在屏幕左上角的图形/ SVG元素之外(html元素)紧接着这一点.

这就是我附加工具提示的方式:

    jQuery('g circle').tipsy({
        gravity: 'w', 
        html: true,
        title: function() {
            return this.textContent;
        }
    })

任何关于我做错的建议都会非常感激.

Answer 1

Tipsy 在元素上使用 offsetWidth 和 offsetHeight。它假设这样的事情适用于 SVG 元素，不幸的是，这个假设在 Chrome/Safari 之外是不正确的。

CSSOM规范规定 offsetWidth/offsetHeight 是 html 元素属性。Chrome/Safari 似乎已将这些放在其 SVG 元素上，但没有规范表明情况应该如此。

您要么需要修复醉酒才能跨浏览器，要么让作者去做。使用 getTransformToElement 和/或 getBBox 可能是所需要的。