Series

[Tom]

I would like to create a chart that can switch between LineSeries and RangeColumnSeries, and also display both series simultaneously. However, the x-axis for the LineSeries ranges from 0 to 900, while the RangeColumnSeries displays these points divided into intervals, ultimately showing only from 0 to 10. If both series are displayed at the same time, how can I allow others to discern which sections of the LineSeries correspond to the Columns in the RangeColumnSeries?

[Arul Jenith Berkmans]

Hi Tom,

You can achieve your requirement by setting the segment color path for LineSeries data points based on intervals divided and using multiple X-axes. Below is a simple code snippet demonstrating how to apply segment color customization for a LineSeries:

ViewModel:

public class ChartViewModel

{

    public ObservableCollection<ChartDataPoint> LineData { get; set; }

 

    public ChartViewModel()

    {

        LineData = new ObservableCollection<ChartDataPoint>();

            GenerateLineData();

        GenerateColumnData();

    }

 

    private void GenerateLineData()

    {

        for (int i = 0; i <= 900; i++)

        {

 

 

            double y = Math.Sin(i * Math.PI / 180) * 100;

 

            // Determine the interval index (0–10)

            int intervalIndex = i / 90;

 

            // Assign a color based on the interval

            Brush segmentColor = GetColorForInterval(intervalIndex);

 

            LineData.Add(new ChartDataPoint

            {

                X = i,

                Y = y,

                SegmentColor = segmentColor

            });

 

        }

    }

 

 

}

 

XAML:

 <!-- LineSeries -->

 <chart:LineSeries ItemsSource="{Binding LineData}"

                   XBindingPath="X"

                   YBindingPath="Y"

                   Label="LineSeries"

                   SegmentColorPath="SegmentColor"

                   StrokeThickness="2" />

 

 

For more information, please visit the following document: Appearance in WPF Charts control | Syncfusion

 

Additionally, to highlight specific segments, you can use the Selection behavior for both Line and Column series. You may also consider using StripLines to visually mark or select specific regions within the chart.

 For more details, please visit the following documents:

Selection: Selection in WPF Charts control | Syncfusion

StripLines: Selection in WPF Charts control | Syncfusion

 

We’ve attached a simple sample demonstrating segment color path usage for your reference.

If we’ve misunderstood your requirement or if you need help with a more specific scenario, please let us know—we’re happy to assist further.

 

Regards,

Arul Jenith .

Attachment: WPFlineseriesSample_F197334_c53938ef.zip