0
380
ViewsLa información sobre herramientas de Chart.js no muestra todos los valores de los conjuntos de datos del eje x en un punto específico en el gráfico de líneas, problema con el modo: 'índice'
Solía usar la siguiente configuración en Chart.js@2.9.4 en SvelteKit y mostraba todos los valores del conjunto de datos en un punto específico del gráfico de líneas. [ENLACE DE REEMPLAZO]
options: { tooltips: { mode: 'index', intersect: false }, hover: { mode: 'nearest', intersect: true }, responsive: true }La salida fue:
Después de actualizar el gráfico a chart.js@3.8.0, no muestra todos los conjuntos de datos en un punto como la configuración anterior.
Esta es la salida en chart.js@3:
Espero que muestre todos los conjuntos de datos en un punto.
¡Gracias de antemano!
1 answers
Answer question0
Esto se debe a que está actualizando a una nueva versión principal que tiene varios cambios importantes, por lo que la configuración de información sobre herramientas se movió del espacio de nombres options.tooltips al espacio de nombres options.plugins.tooltip , si cambia esto, funciona como se esperaba. Le sugiero que primero lea la guía de migración, ya que hay más cosas cambiadas que se romperán si solo actualiza el número de versión.
const options = { type: 'line', data: { labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"], datasets: [{ label: '# of Votes', data: [12, 19, 3, 5, 2, 3], borderColor: 'pink' }, { label: '# of Points', data: [7, 11, 5, 8, 3, 7], borderColor: 'orange' } ] }, options: { plugins: { tooltip: { mode: 'index', intersect: false } } } } const ctx = document.getElementById('chartJSContainer').getContext('2d'); new Chart(ctx, options); <body> <canvas id="chartJSContainer" width="600" height="400"></canvas> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.8.0/chart.js"></script> </body>