Hey Guys,
I’m faced with a real strange behavior regarding the size (mostly regarding the width) of the vaadin chart component. The component is used in an AbsoluteLayout which has a width of 1000px:
// diagrammLayout
diagrammLayout = new AbsoluteLayout();
diagrammLayout.setImmediate(false);
diagrammLayout.setWidth(1000, Unit.PIXELS);
this.addComponent(this.diagrammLayout, "diagrammLayout");
My Chart component also gots a width of 1000px and a defined Height of 562px. The Chart is filled with all values and categories as intended. So all given values are right. Here’s the snippet:
this.chart.setSizeUndefined();
this.chart.setWidth(1000, Unit.PIXELS);
this.chart.setHeight(562, Unit.PIXELS);
this.diagrammLayout.addComponent(this.chart);
If I view the chart in my Browser (e.g., Firefox, Chromium), it appears with a width of 2547px. See here:
If I open the Element Inspector (or close it, or do something else, which is triggering something special in vaadin I don’t know), the width of my components is set to the width-value I intended. Here is the result after just closing and opening the Element Inspector on exactly the same page (as above):
I’ve tried to mark the Component as dirty or dirtyRecursive. I tried to repaint it. I tried to refresh it. Nothing helped. I just don’t know, where the event of repainting the component with the correct and intended values is triggered. Of course, I can’t please the user to open the element inspector, to get faced with an UI that appears as I imlemented it.
Hope to find a solution with your help, guys.
All the best
Seb
