chartjs hover 在數據上沒有懸停在線

Question

當您 hover 超過 chartjs 折線圖上的特定數據點時，可以顯示該點的值。 但是假設您在圖表上是 hover，不是在特定數據點上，而是在“空白空間”上。 在那種情況下，應該有一些 function 來顯示與指針垂直對齊的點的值。 是否存在這樣的解決方案？

基本上，我要問的原因是能夠制作適合移動設備的圖表，並且用戶嘗試用手指點擊小數據點可能會很困難/煩人。

Answer 1

是的，您可以在工具提示配置中將intersect設置為false ：

 var options = { type: 'line', data: { labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"], datasets: [{ label: '# of Votes', data: [12, 19, 3, 5, 2, 3], borderColor: 'orange' }, { label: '# of Points', data: [7, 11, 5, 8, 3, 7], borderColor: 'pink' } ] }, options: { plugins: { tooltip: { intersect: false } } } } var 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.7.0/chart.js"></script> </body>

chartjs hover 在數據上沒有懸停在線

問題描述

1 個解決方案

解決方案1
1 已采納 2022-02-10 19:10:51

chartjs hover 在數據上沒有懸停在線

問題描述

1 個解決方案

解決方案1 1 已采納 2022-02-10 19:10:51

解決方案1
1 已采納 2022-02-10 19:10:51