Issue Resizing Custom Fields [message #1796234] |
Mon, 08 October 2018 14:37 |
|
Hello ,
I am facing an issue with setting up the correct size of some custom fields I set,
I created some charts using charts.js library and putted them inside a Form, the form is a horizontal Grid Layout with 2 column
the upper fields are correctly set but the 2 field down have problems please take a look on the image, mainly the donouts.
ech field has this in the configuration :
@Override
protected int getConfiguredGridH() {
// TODO Auto-generated method stub
return 2;
}
@Override
protected double getConfiguredGridWeightY() {
// TODO Auto-generated method stub
return 1;
}
for the donout charts I have a layout.js file and it contain the following code :
var ctx = document.getElementById("piechartField");
$('#ctx').css({'width':'100px','height':'100px'});
$('#htmlContainer').css({'width':'100px','height':'100px'})
This is not giving any result, the donouts is not fitting to the boxgroup.
Any idea ?
Kind Regards
|
|
|
Re: Issue Resizing Custom Fields [message #1796291 is a reply to message #1796234] |
Tue, 09 October 2018 16:43 |
|
Hi
Maybe you just need to set the option maintainAspectRatio to false (see http://www.chartjs.org/docs/latest/general/responsive.html).
And I don't think you need the code in layout.js. If the option responsive is true, Chart.js should automatically adjust the size of the canvas based on the size of its container. At least that is how I understand the responsive option.
Alternatively you could disable the responsive option and use a custom layout to set the size of the Chart.js canvas. I am not sure if scout.SingleLayout would work because of the canvas and its different sizes (render size, display size).
|
|
|
Powered by
FUDForum. Page generated in 0.03749 seconds