Pre loader

Color points to match line color

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums


I am using the MVVM pattern.
I need the ability to create and style a variable number of line series in a chart.
In order to accomplish this I am binding the RenderableSeries to a collection in my view model.

  RenderableSeries="{Binding HistoricalRenderableSeries, Mode=TwoWay}"
  DataSet="{Binding ChartData, Mode=TwoWay}" SciChart:ThemeManager.Theme="ExpressionLight">

And then I am setting the various styles like SeriesColor and StrokeThickness in my view model.
I am now trying to color the points on each line to match the color of the line using a control template.

<ControlTemplate x:Key="ChartShowPointTemplate">
<Ellipse Height="6" Width="6">
<Style TargetType="{x:Type Ellipse}">
<Setter Property="Visibility" Value="Visible"/>
<!–<Setter Property="Fill" Value="Green"/>–>
<Setter Property="Fill" Value="{Binding Path=SeriesColor, Converter={StaticResource ColorToBrushConverter}, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type SciChart:FastLineRenderableSeries}}}"/>–>

But I get the following error:

System.Windows.Data Error: 4 : Cannot find source for binding with reference ‘RelativeSource FindAncestor, AncestorType=’Abt.Controls.SciChart.FastLineRenderableSeries’, AncestorLevel=’1”.
BindingExpression:Path=SeriesColor; DataItem=null; target element is ‘Ellipse’ (Name=”); target property is ‘Fill’ (type ‘Brush’)

I have tried many several options to try and get this work.
If I hard code to GREEN I do see green points on my line.

Any ideas?

  • You must to post comments

Hi there,

Thanks for posting such a clear question & example! 🙂 I know why this doesn’t work. The ControlTemplate internally is rendered to a bitmap and stored on the RenderableSeries. Later it is blitted directly to the screen, i.e. the UIElement created by the ControlTemplate is never in the Visual Tree.

The only way I can think of to do this, is to create the control template in code via a helper class. See this article on creating control templates programmatically.

For instance, if you had a class, call it PointMarkerHelper, it might have a method with the following signature

public PointMarkerHelper
    public ControlTemplate CreateMarker(Color fill, Color? stroke, Shape shape)
        // TODO

Then you could create a point marker with minimum fuss programmatically.

Here, I’ve attached a sample to this post. Also a screenshot of the result. Take a look and let me know if it helps!

  • Charith Jayasundara
    Hi Andrew, Could you please attach your attachment again? Link seems to have broken. Thanks!
  • You must to post comments
Showing 1 result
Your Answer

Please first to submit.

Try SciChart Today

Start a trial and discover why we are the choice
of demanding developers worldwide

Start TrialCase Studies