Posted 4 May 2018, 1:24 am EST
Hi,
A dynamic dashboard is created as per thehttp://demos.wijmo.com/5/Angular/DynamicDashboard/DynamicDashboard/
But we need to show the widget in full width if it is single component.
Ex : In the above link, if only bar chart is added (only one component) entire width is occupied by that tile. However the inner wjFlexChart is only occupying 50% width.
As per out requirement, one row can accommodate 2 components at max.
I modified code such that a single component in row takes 100% width (WjFlexChart) and for 2 component they share 50%-50%. Everything is working fine if rendering simultaneously.
Problem comes if first component is rendered and second component is added later.
First component is occupied with 100% and second component is added with 50%. So in total of 150% for single row.
These two components are adjusted to 50% - 50% (ie. row with width 100%) when the window is resized manually.
I tried using invalidateAll() on each flexChart but these components are not resizing till browser resize is done.
Please suggest.
const chart = flexChartContainer.querySelector ('wj-flex-chart'); wjcCore.Control.invalidateAll(chart);
(A row contains 2 flexChartContainer and each flexChartContainer contains 1 wj-flex-chart)