Actualmente estoy usando un gráfico de líneas con chart.js 3.5.0 y react-chart-js 3.0.4, con dos conjuntos de datos.
El primer conjunto de datos tiene datos en formato {x,y} con valores nulos para algún y. Al pasar el cursor sobre esos valores nulos, la información sobre herramientas salta al comienzo del segundo conjunto de datos. En este caso, me gustaría ocultar la información sobre herramientas, pero abordar el problema con devoluciones de llamada no funcionó.
¿Alguien ha experimentado el mismo problema?
const options = { interaction: { intersect: false }, maintainAspectRatio: true, animation: false, plugins: { tooltip: { mode: 'nearest', axis: 'x', position: 'average', yAlign: "bottom" }, }, scales: { y: { type: 'linear', beginAtZero: true, min: 0, grace: '20%', } }, chartArea: { backgroundColor: "rgb(240,240,240)" } }
Puede usar mode: 'x'
en su configuración de información sobre herramientas. Junto con establecer pointHitRadius
en 0 en ambos conjuntos de datos, hace que no tenga valores duplicados en su información sobre herramientas.
Ejemplo: https://codesandbox.io/s/hardcore-brown-1vxcjh?file=/src/components/CChart.jsx