Chart Flickering

I’m submitting a … (check one with “x”)

[*] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here

Current behavior

chart flickers as per the attachment. currently tested on vertical bar chart. Also on other machines not able to reproduce.

Expected behavior

it should resize as as per container Reproduction of the problem

1. go to https://swimlane.github.io/ngx-charts/
2. open developer console as per attachment so that view height will be around 300 px
3. toggle fit container or Show X axis or Show Y axis What is the motivation / use case for changing the behavior?

we’ve been trying to implement it in angular-gridster2 widgets. we have removed view attribute and it fits to container. When we make the widget big chart renders as expected and fit to widget but when we make the widget small it start flickering.

note: When widget resize chart doesn’t fit to container, we had to add window.dispatchEvent(new Event(‘resize’)); to the widget’s resize callback. Please tell us about your environment:**

Windows 7 Display - 1366 x 768

• ngx-charts version: 5.1.2
• d3: 4.8.0

• Angular version: 4.0.2

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

Chrome 58.0.3029.81

• Language: [all | TypeScript X.X | ES6/7 | ES5] Typescript 2.2.0

[pierluigilenoci]

@marjan-georgiev @Hypercubed Can you please plan somehow to solve this problem? Thank you.

[jkrieg]

First time posting, forgive the lack of introduction: I have encountered this issue as well. I understand that it is quite a challenge to solve for all cases, but I have a thought on this matter: If the calculation for tilting the text in either direction yields no positive result, could you shrink the font, further reduce the number of characters allowed, or place the text within the bar itself?