使用Chart.js和react-chartjs-2在小屏幕上显示工具提示问题-在大屏幕上工作正常

oewdyzsn  于 2023-10-18  发布在  Chart.js
关注(0)|答案(1)|浏览(172)

在project中将Chart.jsreact-chartjs-2结合使用时,我遇到了一个特殊的工具提示问题。该问题特别适用于小屏幕,例如笔记本电脑和更小的屏幕,当鼠标悬停在这些屏幕上时,并非图表中的所有区域都会触发工具提示的显示。有趣的是,这个问题在更大的屏幕(24英寸及以上)上不存在。
下面是我使用的图表选项的一个片段:

const options = {
    responsive: true,
    maintainAspectRatio: false,
    showTooltips: true,
    interaction: {
        mode: "index",
        intersect: false,
    },
    plugins: {
        tooltip: {
            mode: "nearest",
            displayColors: false,
            intersect: false,
        },
    },
};

react-chartjs-2:“3.3.0”,
chart.js:“3.6.0”,
react:“17.0.2”,

wj8zmpe1

wj8zmpe11#

经过调查,我发现这个问题与我对应用程序主体的zoom属性所做的更改有关。图表画布不知道如何处理这些关于工具提示位置的更改,导致工具提示的初始位置保持不受影响,而其“UI”位置更改。

相关问题