Spacing around chart

[Joshua Rice]

Hello,

I am wondering how you remove ALL space around the chart. The chart I created is a Doughnut type, but even with the legend turned off, the chart only takes up about 50% of its area.

When I inspect the elements, the element in question seems to be "savingsChart_svg_SvgRect" and the actual graph is "savingsChart_svg_SeriesCollection".

Is there anyway to make the chart take up full space? I've already set the width to 100% and isResponsive is true.

Thanks

Joshua

[Saravana Kumar Kanagavel]

Hi Joshua, 

 

Thanks for contacting Syncfusion Support. 

We have analyzed your query and created a sample based on your requirement. And we would like to inform that pie and doughnut chart rendering based on its calculation of proportional ratio by specified height and width to the chart. So if you wish to remove the space on around the chart, then please refer the code example below. 

 

[JS] 

$("#container").ejChart( 

        { 

            elementSpacing: 0,   // you can remove the space by based on specified value 

            margin: { left: 0, right: 0, top: 0, bottom: 0 }, 

            doughnutSize: 1,  

            size: { height: "500", width: "500" } //You should set the same size for height and width 

        }); 

 

In the above code, we have removed the space on around the chart by using above API’s and also you should specify the doughnut size as 1. 

 

And you can find the sample from the below location. 

 

Sample Link : http://www.syncfusion.com/downloads/support/forum/125987/ze/Sample183976534 

  

Now, doughnut chart has been rendered without spacing. 

 

Please fin the outputs of the sample below 

 

 

 

 

 

Please let us know if you have concern. 

 

Regards, 

Saravana Kumar K