How to remove empty space around the chart?

[Pawel Nowak]

I have exactly the same problem as described here: https://www.syncfusion.com/forums/160808/how-to-remove-space-around-semicircle-angular-gauge

The solution provided for Angular does not work for VueJS. Please show me a sample code where the chart fits the container (div) horizontaly and there is no extra space on top or bottom (div is not streched vertically).

[Swetha Babu]

Hi Pawel, 

 

Thank you for contacting Syncfusion support. 

 

We are not able to reproduce the reported issue in the Vue application with Circular Gauge control. We can fit the Circular Gauge in the container by setting the radius of the gauge as “100%”, allowMargin property as false and the margin must be set to zero. We need to set the height of the gauge less than the width of the gauge as the gauge is semi-circle shaped. However, we have created the Vue application to demonstrate the same and it can be downloaded from the below link. 

 

https://www.syncfusion.com/downloads/support/forum/165370/ze/CircularGauge1435399985 

 

Please find the screenshot of the Circular Gauge with reduced spacing below. 

 

 

In the above screenshot, we have rendered the semi-circular gauge that fits the container. Please let us know if the above application meets your requirement. If not, please modify the above application based on your requirement. It will be helpful for us to analyze further and assist you better. 

 

Regards, 

Swetha Babu