Sparkline 列图表位置的动态宽度工具提示不正确。

说明

小列图表在计算其位置+工具提示的宽度为 < 图表宽度的条的元素工具提示位置时有困难.

这是因为在https://GitHub.com/apexcharts/apexcharts.js/blob/main/src/modules/tooltip/Intersect.js#L200上的代码.

它似乎负责抵消工具提示x位置的宽度。 因为只有工具提示会因为宽度而溢出图表时才会出现这种情况.

这可以通过在工具提示上设置一分长来工作,以确保所有工具提示会溢出.

• 重现步骤

1. 访问 https://codepen.io/dareid/pen/azdVqKx
2. Hover over 第3个数据点,注意工具提示位于条上方.
3. Hover over 第1和第2个数据点,注意他们的x位置与酒吧相去甚远.

• 预期行为

所有工具提示应位于活动栏上方。

实际行为

只有宽度+栏位大于图表宽度的工具提示才能被正确放置.

QQ 屏幕截图

<! -- 如果问题是一个视觉问题,请包括显示问题可能的截图 -- -- >

<img宽度="142"高="93" alt="Image" src="https://GitHub.com/user-attachments/assets/b27d6fbc-38e2-4cb8-b8e2-f1ef2dc113"/.

复制链接

https://codepen.io/dareid/pen/azdVqKx 页面存档备份,存于互联网档案馆.

<! -- 需要解释 > {\fn华文仿宋\fs16\1cHD1D1D1}快跑! 修改此代码 https://codepen.io/apexcharts/pen/bxzgZJ 以清晰地显示问题,将问题叉出并粘贴由此产生的代码 。 请确保这是一个最小的例子, 仅包含最低限度的必要代码 帮助我们解决你的问题。 没有可复制实例的问题/出错报告将会被关闭,所以确保您包含一个。

如果您正在使用 vue- apexcharts, 并且想要在 Vue 环境中创建演示, 请使用 CodeSandbox Vue 模板 - https://codesandbox.io/s/pwz8009n0 如果您正在使用反应- apexcharts, 并且想要在反应环境中创建演示, 请使用 CodeSandbox React 模板 - https://codesandbox.io/s/6yoqonyo7r . > 时间