horizontal bar chart increases row height on resize when maintainAspectRatio is set to false
See original GitHub issue- I have read the guidelines for contributing
- I have included an example of my issue on a website such as JS Bin, JS Fiddle, or Codepen.
Steps to reproduce:
new Chart(ctx, {type: 'horizontalBar', data})
maintainAspectRatio: false
- resize your window
Issue Analytics
- State:
- Created 7 years ago
- Reactions:1
- Comments:6 (3 by maintainers)
Top Results From Across the Web
horizontal bar chart increases row height on resize when ...
Steps to reproduce: new Chart(ctx, {type: 'horizontalBar', data}); maintainAspectRatio: false; resize your window.
Read more >Set height of chart in Chart.js - javascript - Stack Overflow
If you disable the maintain aspect ratio in options then it uses the available height: var chart = new Chart('blabla', { type: 'bar',...
Read more >How to Resize the Chart and maintainAspectRatio in Chart JS
The canvas tag, javascript, arrays and Chart JS all need to be combined to draw an eye catching bar chart or line chart....
Read more >How to Set Dynamic Height for Bar Chart in Chart js - YouTube
How to Set Dynamic Height for Bar Chart in Chart jsIn this video we will cover how to set dynamic height for bar...
Read more >Responsive Charts - Chart.js
Note that in order for the above code to correctly resize the chart height, the maintainAspectRatio option must also be set to false...
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
Fixed in 2.1.6 we default to a block style if one is not set on the canvas. See https://jsfiddle.net/pxzzo24p/1/
I ran into this issue on 2.3.0. It occurred because the container had other items in it besides from the canvas. By putting the canvas inside its own container and setting container position:relative everything works beautifully. Example how to break it: https://jsfiddle.net/pxzzo24p/14/