With Stacked Column Chart, cannot remove the spacing between bars.

[mehmet m]

Hi,

I am trying to remove the space between the consecutive data point using Stacked Column Chart, as per the requirements of the project. 

I have tried;

Setting `Width` property on the `CommonSeriesOptionsBuilder` , on the `SeriesBuilder`, on each point added to the Series.

Maybe a tricky way, Using regular Column Chart with a pair of series, of which one is added to another in element-wise fashion. Setting the SideBySide property to `false`,  then using

$('#container').ejChart('option', { commonSeriesOptions: { columnSpacing: 0 } });

$('#container').ejChart('option', { commonSeriesOptions: { columnWidth: 1 } });

To no avail. 

Is this case covered by Syncfusion Charts? If so how can I achieve the effect?

The image attached can give you a clearer view on the requirements.

Thanks in advance.

Attachment: Capture_e54d2b26.zip

[Sanjith Kesavan]

Hi Mehmet, 

Thanks for contacting Syncfusion support. We have analyzed your query and screenshot. To remove the space between the consecutive data points in the stacked column chart, please follow the below code. 

[CSHTML] 

.CommonSeriesOptions(cr => cr.Type(SeriesType.StackingColumn).EnableAnimation(true).ColumnSpacing(0).ColumnWidth(1).Tooltip(tt => tt.Visible(true) 

        .Format("#series.name#  <br/> #point.x# : #point.y# Million Visitors"))) 

 

In the above code, we have set the columnSpacing as 0 and columnwidth as 1. By default, border width for the series is 1 and border color is transparent, so this will leave some space between the points, to avoid this, please set the same color for border and series. Please find the below screenshot. 

 

 

In the below link, we have attached sample for your reference.  

Sample link: http://www.syncfusion.com/downloads/support/forum/124058/ze/sample31885664  

Regards, 

Sanjith. 

[mehmet m]

When I tried your solution I got: 

CS1061: 'Syncfusion.JavaScript.DataVisualization.CommonSeriesOptionsBuilder' does not contain a definition for 'ColumnSpacing' and no extension method 'ColumnSpacing' accepting a first argument of type 'Syncfusion.JavaScript.DataVisualization.CommonSeriesOptionsBuilder' could be found (are you missing a using directive or an assembly reference?)

Copy pasting the Chart code to existing project resulted in the same error being raised. Is this a version issue, if so which version should I be using?

[Sanjith Kesavan]

Hi Mehmet, 

We have analyzed your query. We have provided the ColumnSpacing and ColumnWidth support from Essential studio 14.1.0.41 version. If you are using Essential studio prior to this version, then please update your Essential Studio to the current version (14.1.0.46).  

Regards, 

Sanjith.