We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to resize a WPF column chart control without stretching the columns?

Thread ID:





115611 Jan 24,2014 07:33 PM UTC Jan 28,2014 06:35 PM UTC WPF 2
Tags: Chart
Theodosia Konstantinidou
Asked On January 24, 2014 07:33 PM UTC


I have a WPF chart control and I have given to the columns a specific width. What I want is to resize the whole grid and the chart area without stretching the columns.
Is there any way we can accomplish this?

Thank you in advance,

Theodosia Konstantinidou

Karthikeyan V [Syncfusion]
Replied On January 28, 2014 05:48 PM UTC

Hi Theodosia,

Thanks for using the Syncfusion products.

We have analysed the reported requirement. You can achieve your requirement with two ways.

Solution 1: SegmentWidthMode

Your requirement can be achieved by using the SegmentWidthMode as Relative and specified the columns width in data collection.

Code Snippet [XAML]:



SegmentWidthMode="Relative" // Segment Width mode works with only Non-Indexed  


IsIndexed="False"   Name="Series1"   BindingPathX="ProdId" Type="Column"


BindingPathsY="Stock,Size" // Stock as YValue and Size as column Width

DataSource="{Binding Products}" />


Solution 2: Custom Template

Also you can achieve your requirement by applying the custom template. Please find the code snippet for this in below:

Code Snippet [XAML]:

        <DataTemplate x:Key="columnTemplate">

            <Grid HorizontalAlignment="Left" VerticalAlignment="Top" RenderOptions.EdgeMode="Aliased" Height="{Binding Height}" Width="{Binding Width}">


                    <MultiBinding Converter="{StaticResource ColumnMargin}">

                        <Binding Path="X" />

                        <Binding Path="Y" />



                <Rectangle     Width="10" Height="{Binding Height}" Fill="{Binding Interior}" Stroke="{Binding Stroke}"

                 StrokeThickness="{Binding StrokeThickness}" ToolTip="{Binding ToolTip}" />



<chart:ChartSeries  Template="{StaticResource columnTemplate}"    BindingPathX="ProdId" Type="Column" BindingPathsY="Stock,Price" DataSource="{Binding Products}"></chart:ChartSeries>


We have prepared a sample based on this and please find the sample under the following location.

Please let us know if you require further assistance on this.


Karthikeyan V.


Theodosia Konstantinidou
Replied On January 28, 2014 06:35 PM UTC

Hi Karthikeyan V!

I have already tried the first solution, but it didn't work in my project. However, the second solution you provided (the one with the custom template) was exactly what I wanted.

I really thank you very very much!

Theodosia Konstantinidou


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

or the page will be automatically redirected to sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon