javascript - getBoundingClientRect 给出了错误的值

Question

我正在为 ChartJS 使用自定义工具提示并定位工具提示，我需要使用 getBoundingClientRect 来获取图表的位置，然后相对于该位置移动工具提示。但是，从 getBoundingClientRect 返回的位置并不代表实际的 div。没有填充，没有边距等This red box indicates the actual div border and the green is the box returned from getBoundingRect

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

Answer 1

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