Mirrors/Chart.js
1
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2024-10-06 12:19:08 +02:00
Code Issues Packages Projects Releases Wiki Activity

Update the responsive docs about resizing the parent node (#5974)

Browse Source 
Add a note about resizing the chart height with maintainAspectRatio
This commit is contained in:
Janelle deMent 2019-01-13 16:20:25 -04:00 committed by Simon Brunel
parent f3dd96779a
commit 352e53a0b6
1 changed files with 3 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
docs/general/responsive.md
View File

@ -33,8 +33,11 @@ The chart can also be programmatically resized by modifying the container size:
```javascript ```javascript
chart.canvas.parentNode.style.height = '128px'; chart.canvas.parentNode.style.height = '128px';
chart.canvas.parentNode.style.width = '128px';
``` ```
Note that in order for the above code to correctly resize the chart height, the [`maintainAspectRatio`](#configuration-options) option must also be set to `false`.
## Printing Resizeable Charts ## Printing Resizeable Charts
CSS media queries allow changing styles when printing a page. The CSS applied from these media queries may cause charts to need to resize. However, the resize won't happen automatically. To support resizing charts when printing, one needs to hook the [onbeforeprint](https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeprint) event and manually trigger resizing of each chart. CSS media queries allow changing styles when printing a page. The CSS applied from these media queries may cause charts to need to resize. However, the resize won't happen automatically. To support resizing charts when printing, one needs to hook the [onbeforeprint](https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeprint) event and manually trigger resizing of each chart.