javascript - getBoundingClientRect 给出不正确的值

Question

我正在为 ChartJS 使用自定义工具提示并定位工具提示，我需要使用 getBoundingClientRect 来获取图表的位置，然后相对于该位置移动工具提示。但是，从 getBoundingClientRect 返回的位置并不代表实际的 div。没有填充，没有边距等。这个红色框表示实际的div边框，绿色是从getBoundingRect返回的框

知道为什么会这样以及如何解决吗？我的页面在调整大小时发生了一些变化，所以我不能硬编码 -150px 或其他任何东西。

标签： javascripthtmlcsstooltipchart.js

Answer 1

问题是 getBoundingClientRect 考虑了我的整个内容包装器的边距。当调整页面大小以更好地适应内容时，此包装器的边距会更改，因此 getBoundingClientRect 也会更改其输出。我不确定为什么只考虑这个 div 的边距，但我只是从顶部和左侧值中减去边距来解决我的问题。