Tooltips partially disabled on bar graph when scales > y > beginAtZero set to false
See original GitHub issueExpected Behaviour
All tooltips show on hover, since I have not changed any settings for them.
Current Behaviour
Tooltips do not show on hover.
Steps to Reproduce
Create any bar chart and within the options add:
options: {
scales: {
y: {
beginAtZero: false // <-- this is the line that breaks stuff
}
}
}
For creating random data I use the following:
const makeData = () => {
var list = [];
for (var i = 0; i < barChartLabels.length; i++) {
list.push(Math.floor(Math.random() * 50 + 250));
}
return list;
}
Edit: Further testing has revealed that the + 250
part of the data creation is what is breaking things. The size of that number is not the issue though, since I have recreated the disappearing tooltips with as low a number as 5. However this breaks some of the tooltips instead of all of them.
Context
I want to be able to analyse each value if necessary. With such large values, adding minor gridlines between the major ones shown is an unrealistic solution so the tooltips are needed.
Environment
- Chart.js version: 3.4.x
- Browser name and version: Chrome, Firefox, Edge - all latest versions
- Link to your project: https://jsfiddle.net/7xeaqyvr/3/
Issue Analytics
- State:
- Created 2 years ago
- Comments:5 (3 by maintainers)
Top Results From Across the Web
v3.8.0: Odd behavior for tooltip on horizontal bar with ... - GitHub
I followed the instructions for making a horizontal bar chart, ... y: { beginAtZero: true, min: 0, max: 100, ticks: {display: false}, ...
Read more >Hide/disable tooltips chart.js - Stack Overflow
I have tried this code, but they never hide. Chart.defaults.global.tooltipenabled = false;. You can see all the code here of the chart: https://jsfiddle ......
Read more >Line Chart - Chart.js
A line chart is a way of plotting data points on a line. Often, it is used to show trend data, or the...
Read more >search_plus_index.json - UNPKG - chart.js
In this example, we create a bar chart for a single dataset and render that in ... can help you customise your charts...
Read more >Tooltips | Charts - Google Developers
You can see the tooltip by hovering your mouse over any of the bars in the chart. Hover over the bars to see...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I feel like this might have been caused by some changes that no longer clip the bar size to the visible space. I would think that any bar that is visible should be interactable.
Half width sounds like the best solution, since that should also work for large negative numbers as well.