Responsive Charts slightly bigger than container

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

[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 the svg element is marginally bigger than its parent container in responsive mode if parent container has padding

Expected behavior the svg element would fit the parent container in responsive mode and take account of the padding

Reproduction of the problem Use any container that has padding e.g. BS4 card <div class="card"> <div class="card-header"> State Of The Parties </div> <div class="card-block" style="width:100%; min-height: 300px;"> <ngx-charts-bar-horizontal [scheme]="colorScheme" [results]="partyTotals" [yAxis]="true" [xAxis]="true" [legend]="false" [showGridLines]="false" [showXAxisLabel]="true" [showYAxisLabel]="true" [yAxisLabel]="Parties" [xAxisTickFormatting]="xBarFormat" (select)="onSelect($event)"> </ngx-charts-bar-horizontal> </div> </div>

What is the motivation / use case for changing the behavior? Chart hangs outside its container

Windows 10

• ngx-charts version: 4.1.2
• Angular version: 2.4.7

[kwes01]

some one found a solution for this???

[gpit2286]

It also seems that when the charts are drawn within a fxFlex box, they are drawn before the flex box width is computed.

Onload:

After moving the window a little to get the observeables to fire:

Is there a way to get this polling to happen programmatically?