javascript - 悬停在图表上时工具提示闪烁

Question

我已经在 chartjs 中为我的图表创建了自定义工具提示。但是当我将鼠标悬停在图表上时，问题就来了，工具提示开始闪烁。任何人都知道我该如何防止这种情况？谢谢!

if (!tooltip) {
               var tooltip = document.createElement('div');
               tooltip.id = 'tooltip';
               document.body.appendChild(tooltip);
            }

            if (!model.opacity) {
               tooltip.style.display = 'none';
               return;
            }

            tooltip.innerHTML = `<div class="tooltip-body">
                                            <label>` + model.body[0].lines[0] + `</label>
                                        </div>
                                        <div class="tooltip-caret"></div>`;

            tooltip.style.display = 'inline-block';
            tooltip.style.position = 'absolute';
            tooltip.style.top = getTooltipPosition().y + 'px';
            tooltip.style.left = getTooltipPosition().x + 'px';

Answer 1

尝试设置样式 - pointer-events到 none ，对于工具提示元素，像这样:

...
tooltip.style.pointerEvents = 'none';
...