Pre loader

HOw to set the Style of a RenderableSeriesVIewModel

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

0
0

Dear all,

I am using part of your sample where we can select the renderable series through MVVM patterns, This works great but by default I set the style them ExpressionLight for my chart, but I need to overwrite the style for the render series when building them

From your sample code you have the following :

if (type == typeof(LineRenderableSeriesViewModel))
        {
            return new LineRenderableSeriesViewModel { 
                DataSeries = xyDataSeries,
                StyleKey = "LineStyle"
            };
        }

What I try to do is that in ma application resource file I have define a style with a x:key name that I would like to use to represent the line series, like color, strokethickness, dash,…. In the constructor above you expect to get a string key value for StyleKey.

hoy can I pass my own Style resource to LineRenderableSeriesViewModel ?

Thanks for help

Version
4
  • You must to post comments
0
0

You’re mixing a few concepts here.

  1. Theme – is a set of colors applied to a chart

  2. Style – is a WPF Style applied to an element in a chart (which might contain colors, or other property values).

In the MVVM API you apply a stylekey using this technique:

First, declare a style with Key

<UserControl x:Class="WpfApplication3.HelloSciChartWorld"
          xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
          xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
          xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
          xmlns:s="http://schemas.abtsoftware.co.uk/scichart"
          xmlns:local="clr-namespace:WpfApplication3"
          mc:Ignorable="d"
          d:DesignHeight="400" d:DesignWidth="600">
   <UserControl.Resources>
      <local:HelloSciChartWorldViewModel x:Key="viewModel"/>

      <Style TargetType="s:FastLineRenderableSeries" x:Key="LineSeriesStyle0">
         <Setter Property="StrokeDashArray" Value="5 5"/>
         <Setter Property="StrokeThickness" Value="4"/>
         <Setter Property="Stroke" Value="Orange"/>
         <Setter Property="SelectedSeriesStyle">
            <Setter.Value>
               <Style TargetType="s:FastLineRenderableSeries">
                  <Setter Property="StrokeDashArray" Value="5 5"/>
                  <Setter Property="StrokeThickness" Value="3"/>
                  <Setter Property="Stroke" Value="White"/>
               </Style>
            </Setter.Value>
         </Setter>
      </Style>

   </UserControl.Resources>

   <Grid DataContext="{StaticResource viewModel}">
      <s:SciChartSurface RenderableSeries="{s:SeriesBinding SeriesViewModels}">
         <s:SciChartSurface.XAxis>
            <s:NumericAxis/>
         </s:SciChartSurface.XAxis>

         <s:SciChartSurface.YAxis>
            <s:NumericAxis GrowBy="0.1, 0.1"/>
         </s:SciChartSurface.YAxis>

      </s:SciChartSurface>
   </Grid>
</UserControl>

Second, apply the StyleKey via the StyleKey property of RenderableSeriesViewModel

public class HelloSciChartWorldViewModel : INotifyPropertyChanged
{
       private readonly ObservableCollection<IRenderableSeriesViewModel> _seriesViewModels = new ObservableCollection<IRenderableSeriesViewModel>();

       public event PropertyChangedEventHandler PropertyChanged;

       public HelloSciChartWorldViewModel()
       {
             var xyData = new XyDataSeries<double, double>();
             for (int i = 0; i < 100; i++)
             {
                    xyData.Append(i, Math.Sin(i * 0.2));
             }

             SeriesViewModels.Add(new LineRenderableSeriesViewModel()
             {
                    DataSeries = xyData,       
                    // Set the StyleKey equal to the x:Key in XAML
                    StyleKey = "LineSeriesStyle0"
             });
       }

       public ObservableCollection<IRenderableSeriesViewModel> SeriesViewModels
       {
             get { return _seriesViewModels; }
       }

       protected virtual void OnPropertyChanged(string propertyName)
       {
             var handler = PropertyChanged;
             if (handler != null)
             {
                    handler(this, new PropertyChangedEventArgs(propertyName));
             }           
       }
}

That is it, and it should work if followed correctly.

Best regards,
Andrew

  • Ryan Franklin
    How do we do this with a SeriesAnimation? Doing the following doesn’t work: ” “
  • 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