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

Is it possible to have ColumnSeries and LineSeries on the same chart ?

Thread ID:





132323 Aug 26,2017 06:44 AM UTC Aug 29,2017 03:42 AM UTC WPF 3
Tags: SfChart
Asked On August 26, 2017 06:44 AM UTC


I'd like to create a chart that contains some distributions of values over time.
I have, for each month, both period values and cumulated values.
I'd like to create a chart where the user can graphically see both period or cumulated values.
So my idea is to creata a chart where, for each time period, and for each distribution (series), I can show both a LineSeries for cumulated values or a ColumnSeries (Hystogram) for period values.
I'm wondering if this is possible with your library, since in all your online examples I've always seen only one kind of series type per chart.
I mean a type of chart similar to the one you can see here:


Both hystograms or lines ....

Can you help me ?

Thank you,

Silvio Scattaglia

Durgadevi Selvaraj [Syncfusion]
Replied On August 28, 2017 12:50 PM UTC

Hi Silvio, 

Thanks for contacting Syncfusion Support. 

We have analyzed your requirement (showing period value and distribution value in a chart) and achieved by setting multiples series in a chart as shown in the below code, 
  <chart:SfChart Margin="10"> 
                <chart:CategoryAxis LabelFormat="MMM"/> 
                <chart:NumericalAxis Minimum="0" Maximum="200000" Interval="20000"/> 
                <chart:ChartLegend /> 
            <chart:ColumnSeries ItemsSource="{Binding Collection}" Label="Period" XBindingPath="XValue" YBindingPath="YValue"/> 
            <chart:LineSeries x:Name="series1" Label="Distribution" ItemsSource="{Binding Collection}" XBindingPath="XValue" YBindingPath="Distribution"> 
                <chart:LineSeries.YAxis > 
                    <chart:NumericalAxis  Minimum="0" Maximum="1200" OpposedPosition="True" Interval="200" ShowGridLines="False"/> 

Please find the output screenshot, 
We have prepared a demo sample based on your requirement and it can be downloaded from below link, 

Please let us know if you have any concerns on this. 

Durgadevi S 

Replied On August 28, 2017 02:55 PM UTC

Thank you very much for the help !

Durgadevi Selvaraj [Syncfusion]
Replied On August 29, 2017 03:42 AM UTC

Hi Silvio, 
Thanks for your response. 
Please let us know if you required any further assistance on this. 
Durgadevi S 


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