Pre loader

Tag: MVVM

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 votes
7k views

Hi there,

I am relatively new to C# and scicharts so you will have to forgive me a little.

In the project I am working on, I am trying to add dynamic renderable series as the user selects items in a tree. I have looked through the online tutorials and forums but still am having trouble. I am creating my own renderable series view model class derived off of LineRenderableSeriesViewModel. I found documentation that I needed to override the ViewType property and set it to a FastLineRenderableSeriesForMvvm.

When I am creating these objects to add to the ObservableCollection which is bound to my scichart surface, I can set the PointMarker and its properties, but not the SelectedPointMarker properties.

XAML:

    <s:SciChartSurface Style="{StaticResource BasicSciChartSurfaceStyleRateVsTime}"
                       ViewportManager="{Binding RateVsTimePlot.Manipulator.Viewport}"
                       Name="RateVsTime" x:FieldModifier="private"
                       ZoomHistoryManager="{Binding RateVsTimePlot.ZoomHistory}"
                       PreviewMouseLeftButtonDown="PreviewRateVsTimeMouseLeftButtonDown"
                       PreviewMouseLeftButtonUp="PreviewRateVsTimeMouseLeftButtonUp"
                       RenderableSeries="{s:SeriesBinding RateVsTimePlot.RenderableSeriesViewModels}"
                       local:YAxesCollectionBehaviour.AxisSource="{Binding RateVsTimePlot.YAxesViewModels}"
                       local:YAxesCollectionBehaviour.AxisStyle="{StaticResource AxisStyle}"/>         

Style:

<Style x:Key="ProdLineStyle" TargetType="s:FastLineRenderableSeriesForMvvm">
    <Setter Property="s:TooltipModifier.IncludeSeries" Value="False"/>
    <Setter Property="SelectedPointMarker">
        <Setter.Value>
            <s:EllipsePointMarker Fill="{Binding SeriesColors.ProductionColor}"
                                  Stroke="{Binding SeriesColors.ProductionColor}"
                                  Width="6" Height="6">
            </s:EllipsePointMarker>
        </Setter.Value>
     </Setter>
</Style>

ViewModel :

        var renderableSeries = new GenericRenderableSeriesViewModel
        {
            DataSeries = dataSeries.DataSeries,
            YAxisId = dataSeries.AxisId,
            IsSelected = IsSelected,
            SeriesColors = _dataColors[fluidRateType],
            DisplayEnabled = AnalysisInteractionMode.IsLineManipulationDisabled,
            PointMarker = new EllipsePointMarker(),
            StyleKey = "ProdLineStyle"
        };

        renderableSeries.SetRenderableSeriesColorSettings();

        renderableSeries.DataSeries.SeriesName = fluidRateType.ToString();
        return renderableSeries;

public void SetRenderableSeriesColorSettings()
    {
        Stroke = SeriesColors.ProductionColor;

        if (PointMarker == null) return;

        PointMarker.Stroke = SeriesColors.ProductionColor;
        PointMarker.Fill = SeriesColors.ProductionColor;
        PointMarker.Height = PointNonSelectedHeight;
        PointMarker.Width = PointNonSelectedWidth;
    }

When I run my app, I see what I am expecting by default, but when I do a point selection rectangle, the behavior is not correct. I only see the line. The points with in the rectangle disappear.

I am trying to move away from having the style set the selectedPointMarker, and doing it through code in the view model just like the function above as users will be able to change these properties in the future. But so far I haven’t found a way to do either.

Am I using the correct classes, or do I need to override something else? Any ideas or suggestions would be greatly appreciated

Thanks
Rylan

0 votes
5k views

Hi SciChart team,

I have built a xyscatter chart with DateTime type X-Axis and Double type Y-Axis,
and built boxannotations to mark areas.

May I set the x-Axis value in the tooltip?
Or can I show properties of each item which means every point in the xyscatterseries, and customize the tooltip content style like adding the description of every properties.

  • Wade Yao asked 3 years ago
  • last active 3 years ago
1 vote
9k views

Hello, SciChart Team!
i have an issue using mouse drag event ( RubberBandXyZoomModifier, ZoomPanMidifier). the message says “NullReferenceException in SciChart.Charting.dll ” or “Thread.cs not found” from time to time.
after some experiments i figured out that the app starts to crush after i change XAxis type .
i have a simple mvvm user control used to display both arrays of double and datebound data, XAxes of SciChart Surfase is bound to an observable collection of IAxis elements. if i need to change chart type i clear this collection and create an axis of desired type (DateTimeAxisViewModel or NumericAxisViewModel). after that the series can be added, but zooming causes crash with nearly to no info.

i attached a solution, which lacks only scichart dlls in order to run (hopefully), Window_Loaded method has a commented line which changes chart type and makes app crush on zooming, would be nice if you checked it out.
Thanks in advance!
Alexander

1 vote
14k views

I would like to template items of an AxisCollection assigned to a sciChartSurface in binding of an AxisItemCollectionViewModel. But it looks like I cannot do it as Visual Studio won’t compile my tries.

What i am looking for is something like the EEG 16 channel sample. There the ListBoxItems are styled via a template which is bound to a ViewModelItem. The ListBox itsself is bound to a ViewModelCollection. Depending on how many entries there are entries in the listbox.

So I would like to do something like this:

<SciChartSurface.AxisCollection ItemsSource="{Binding MyAxisCollectionViewModels}" ItemTemplate="{StaticResource AxisItemTemplate}" />

Is this possible? I don’t know how many y-axes i will have. They are configurable by the user.

  • Uwe Hafner asked 9 years ago
  • last active 9 years ago
0 votes
6k views

Hi,

I am developing an MVVM WPF application and need to access the SelectedPointMarkers property of DataPointSelectionModifier from the ViewModel.

From looking at the DataPointSelectionModifier documentation (https://www.scichart.com/documentation/win/current/webframe.html#DataPoint%20Selection.html) I can see how you can get the X and Y coordinate values of a selected point in a view, by binding the PointMarkersSelectionModifier to a listbox.

However this doesn’t really help me, I need to get the coordinates of the SelectedPointMarker into a property inside the ViewModel that can be accessed, rather than just binding to a listbox in the view itself.

I’ve also looked at this similar post: (https://www.scichart.com/questions/wpf/i-want-to-bind-selectedpointmarkers-of-datapointselectionmodifier), but I had no luck getting Kenishis solution to work in my case.

How can i do this?

Thanks.

0 votes
6k views

Hello support team,

We are currently starting a complete redesign of our SciChart implementation from V3.x to V5.x. In V5.x the MVVM pattern is now supported and we would like to use this.
Our main focus is on the performance of the SciChart component. Now the question arises whether the use of the MVVM API is questionable for exactly this reason (performance).
Does it make a big difference whether I address the series directly or via the MVVM API?
Thank you very much for your support!

1 vote
5k views

Hello

In Tutorial 06b – Realtime Updates, I want change the <s:SciChartSurface.XAxis> from <s:NumericAxis/> to <s:DateTimeAxis/> . I have tried a lot, but it still doesn’t work.

Could you please help me to do this work.

Thank you very much.

  • Zhi Zhang asked 7 months ago
  • last active 7 months ago
1 vote
12k views

I’m implementing a toggle between joined and separated axes for my series and I’ve encountered a problem with my SeriesValueModifiers. The modifier seems to be connected to “DefaultAxisId”, when I have my series linked to an axis with that ID the values show up as expected. However, when I separate my series to individual axes the modifiers no longer appears.

Is it possible to collect and show all my SeriesValueModifiers on one axis (keeping the others invisible)? Or perhaps show modifiers on all the axes and stack them on top of each other, keeping labels invisible.

This is the code I’ve got right now:

Adding an axis in my constructor, this one will be used when all the series are using the same axis.

ChartYAxes.Add(new NumericAxis()
{
    Visibility = Visibility.Visible,
    AutoRange = AutoRange.Always,
});

Then I add a new axis for each series.

ChartYAxes.Add(new NumericAxis
{
    Id = tagName,
    Visibility = Visibility.Collapsed,
    AutoRange = AutoRange.Always
});

var renderableSeries = new FastLineRenderableSeries
{
    YAxisId = IsIsolatedCharts ? tagName : "DefaultAxisId"
};

Toggling between these works great, but I need the value labels for this to be useful in any way.

EDIT: In case it’s relevant, here’s the code for toggling.

private void SplitAxes()
{
    var count = Series.Count;
    for (int i = 0; i < count; i++)
    {
        var series = Series[i];
        var name = series.DataSeries.SeriesName;
        //The axes are also added to a dictionary for easy access.
        _axisDictionary[name].GrowBy = new DoubleRange(count - i - 1, i);
        series.RenderSeries.YAxisId = name;
    }
}

private void JoinAxes()
{
    foreach (var series in Series)
        series.RenderSeries.YAxisId = "DefaultAxisId";
}
0 votes
12k views

Hi,
I’m prototyping an application with two visible data series and an individual Y-axis for each data series. See the enclosed image.
The Stroke color of each data series, the TickTextBrush and the BorderBrush of the y-axis are updated by normal data Binding through the MVVM pattern.
The problem is that I am not able to data bind the Stroke property of the MajorTickLineStyle for the individual Y-axis.
Do You know if there is a workaround for this through data binding?
The project is enclosed.

  • andreasrep asked 7 years ago
  • last active 7 years ago
0 votes
3k views

Hi,

I’m trying to evaluate the reality of creating multiple realtime charts and I’m hitting a huge performance brick wall.

My application will have high speed streamed data coming in over ethernet. Currently I’m simulating this with a thread timer that updates 100 data objects at 60Hz. Screen data and chart updates I’ve got throttled to 30Hz but it’s still grinding my charts are still struggling. If I move the mouse pointer the charts freeze entirely until the mouse is still.

I want the end user to be able to choose any data object and chart it however they want. Adding charts and adding plots to charts etc. To enable this I’ve created a chart template as a user control and at runtime the charts are added to a panel on a tab control. Event one chart on one tab chugs though. Move the mouse over it and it locks up.

I have a single overview chart with a scrollbar over the top on the parent control. I need this to control the cursor (vertical line) and shared X visible range. Live data is Fifo limited to a 10 second range. All this works, just painfully slowly.

SharedXVisible range is MVVM bound. Renderable series is LineRenderableSeriesViewModel and data is pushed at 30Hz from a Data provider as per this tutorial:
https://www.scichart.com/documentation/win/current/Tutorial%2006b%20-%20Adding%20Realtime%20Updates%20with%20MVVM.html

CPU usage is sub 20%. Max frame rate is 30fps. Render priority doesn’t seem to make much difference, though “immediate” will lock up the whole app. I’m no expert at performance profiling but I’m not getting any clues from ReShaper dotTrace so far.

I tried creating a version that hand almost no binding and used codebehind to update the data. It didn’t seem to help. I’d rather not do this though as I have a lot of things working that I like such as vertical slice, annotations, templates etc.

I’ve got a list of all the live data on the right of the screen and it all updates rapidly, even while the mouse is moving and the charts are frozen.

I’m also using some Syncfusion controls and theming, if it matters.

I must be missing something obvious surely.

<!--  Define Chart  -->
        <s:SciChartSurface x:Name="chart" Grid.Row="0" Grid.Column="0"
                           Background="Black"
                           RenderPriority="low"
                           MaxFrameRate="30"
                           RenderableSeries="{s:SeriesBinding RenderableSeriesCollection}"
                           >

            <!--  Define X and Y Axis  -->
            <s:SciChartSurface.YAxis>
                <s:NumericAxis AutoRange="{Binding AxisYRangeMode}" 
                               DrawMajorBands="False" 
                               DrawMinorGridLines="false" 
                               DrawMajorGridLines="True" 
                               DrawMajorTicks="False" 
                               DrawMinorTicks="False" 
                               VisibleRange="{Binding AxisYVisibleRange}" />
            </s:SciChartSurface.YAxis>

            <s:SciChartSurface.XAxis>
                <s:NumericAxis AutoRange="{Binding AxisXRangeMode}" 
                               BorderBrush="{StaticResource BorderBrushGray}" 
                               BorderThickness="1" 
                               DrawMajorBands="False" 
                               DrawMinorGridLines="False" 
                               DrawMajorGridLines="True" 
                               DrawMajorTicks="False" 
                               DrawMinorTicks="False" 
                               TextFormatting="0" 
                               VisibleRange="{Binding SharedXVisibleRange, Mode=TwoWay}" 
                               s:VerticalSliceModifier.AxisLabelContainerStyle="{x:Null}"/>
            </s:SciChartSurface.XAxis>

            <!--  Modifiers  -->
            <s:SciChartSurface.ChartModifier>
                <s:ModifierGroup>
                    <s:RubberBandXyZoomModifier 
                        IsXAxisOnly="True" 
                        ZoomExtentsY="True" 
                        IsAnimated="True" 
                        RubberBandFill="#20FFFFFF" 
                        RubberBandStroke="GreenYellow" 
                        RubberBandStrokeDashArray="2 2">
                    </s:RubberBandXyZoomModifier>

                    <s:ZoomExtentsModifier IsAnimated="True"/>

                    <s:MouseWheelZoomModifier IsEnabled="True"/>

                    <s:XAxisDragModifier IsEnabled="True" DragMode="Pan"/>

                    <s:LegendModifier x:Name="legendModifier"
                                      Background="Transparent" 
                                      Margin="10" 
                                      GetLegendDataFor="AllSeries" 
                                      LegendItemTemplate="{StaticResource CustomLegendTemplate}" 
                                      ShowLegend="True" ShowVisibilityCheckboxes="True"/>

                    <s:VerticalSliceModifier Name="sliceModifier">

                    <s:VerticalSliceModifier.VerticalLines>
                            <s:VerticalLineAnnotation Style="{StaticResource sliceStyle}" 
                                                      X1="{Binding SlicePosition, Mode=TwoWay}"/>
                        </s:VerticalSliceModifier.VerticalLines>
                    </s:VerticalSliceModifier>

                </s:ModifierGroup>
            </s:SciChartSurface.ChartModifier>
        </s:SciChartSurface>

Thanks in advance,
Declan.

PS. I’m trying to attach a screenshot but it keeps saying “Forbidden”.

1 vote
12k views

Hello,

I have a scichart and bound to its VM class. Inside this VM there is a Highlights property.

On the MainWindow, I am placing two of this charts with their own VM instance.

The problem is that when the Annotations is bound, it is only drawn on the last chart as shown in the image.

If I manually code in xaml the annotations (no binding) then the annotations are drawn in both charts.

How can I make it work with the binding?

Thanks

  • Miguel Hau asked 10 years ago
  • last active 10 years ago
0 votes
9k views

Hello!

I am trying to programmatically set a range for HeatmapColorPalette and attached HeatmapColorMap to min and max of my data.

Binding HeatmapColorPalette.Maximum to a property in my View Model works well. However, when I add HeatmapColorMap everything breaks, the heat map no longer responds to changes in View Model.

What am I doing wrong?

Here is my View:

<Window x:Class="SciChartHeatMap.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:SciChartHeatMap"
    xmlns:s="http://schemas.abtsoftware.co.uk/scichart"
    d:DataContext="{d:DesignInstance Type=local:HeatMapViewModel, IsDesignTimeCreatable=True}"
    mc:Ignorable="d"
    Title="MainWindow" Height="450" Width="800">
<Grid>
    <Grid.Resources>
        <s:GradientStopsToLinearGradientBrushConverter x:Key="ColorsToLinearGradientBrushConverter"/>
    </Grid.Resources>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <s:SciChartSurface Grid.Row="0" Grid.RowSpan="2">
        <s:SciChartSurface.RenderableSeries>
        <s:FastUniformHeatmapRenderableSeries x:Name="HeatMapSeries" DataSeries="{Binding Data}" Opacity="0.9">
            <s:FastUniformHeatmapRenderableSeries.ColorMap>
                <s:HeatmapColorPalette Maximum="{Binding ColorMaximum}">
                    <s:HeatmapColorPalette.GradientStops>
                        <GradientStop Offset="0" Color="DarkBlue"/>
                        <GradientStop Offset="0.2" Color="CornflowerBlue"/>
                        <GradientStop Offset="0.4" Color="DarkGreen"/>
                        <GradientStop Offset="0.6" Color="Chartreuse"/>
                        <GradientStop Offset="0.8" Color="Yellow"/>
                        <GradientStop Offset="1" Color="Red"/>
                    </s:HeatmapColorPalette.GradientStops>
                </s:HeatmapColorPalette>
            </s:FastUniformHeatmapRenderableSeries.ColorMap>
        </s:FastUniformHeatmapRenderableSeries>
        </s:SciChartSurface.RenderableSeries>
        <s:SciChartSurface.XAxis>
            <s:NumericAxis 
                FlipCoordinates="False" 
                ScientificNotation="None" 
                AutoTicks="False"
                MajorDelta="1"
                MinorDelta="0.5"
                AxisAlignment="Top"/>
        </s:SciChartSurface.XAxis>
        <s:SciChartSurface.YAxis>
            <s:NumericAxis 
                FlipCoordinates="True" 
                ScientificNotation="None"
                AxisAlignment="Left"/>
        </s:SciChartSurface.YAxis>
    </s:SciChartSurface>

    <!-- Enabling this will break the program
    <s:HeatmapColorMap
        Grid.Column="1"
        Grid.Row="0"
        Grid.RowSpan="2"
        Margin="5,0,5,0"
        HorizontalAlignment="Right"
        VerticalAlignment="Stretch"
        DataContext="{Binding Source={x:Reference Name=HeatMapSeries}, Mode=OneWay}"
        ColorMap="{Binding ColorMap.GradientStops, Converter={StaticResource ColorsToLinearGradientBrushConverter}}"
        Maximum="{Binding ColorMap.Maximum}"
        Orientation="Vertical">
    </s:HeatmapColorMap>
    -->

    <Label 
        Grid.Row="0" 
        Grid.Column="2" 
        Content="{Binding ColorMaximum}" 
        Width="50" 
        HorizontalContentAlignment="Center"/>
    <Slider 
        Grid.Column="2" 
        Grid.Row="1" 
        Orientation="Vertical" 
        Minimum="0" 
        Maximum="10" 
        HorizontalAlignment="Center"
        Value="{Binding ColorMaximum}"/>
</Grid>

The idea in this small example is for slider to control both HeatmapColorPalette.Maximum and s:HeatmapColorMap.Maximum

The code in my View Model is pretty simple:

private double mColorMax;

public double ColorMaximum
    {
        get => mColorMax;

        set
        {
            mColorMax = value;
            OnPropertyChanged();
        }
    }

My View Model implements INotifyPropertyChanged

I will appreciate any suggestions.

Thank you in advance!

1 vote
18k views

I’ve created an application with MVVM in mind and managed to create a simple, working graph with SciChart that displays the data needed.
I’ve also seen some features (https://www.scichart.com/customer-case-study-blueshift-one-system/) which we’ll be planning on implementing, designing it to fit our own needs of course.

I’m wondering if there are some limitations (and perhaps improvements in later releases), that we could keep in mind while continuing to plan and develop our application with SciChart and MVVM?

0 votes
8k views

Hello,

I have created some ChartModifiers in a ModifierGroup in my ViewModel class (using Caliburn.Micro as MVVM framework, not code behind) and bound the group to my SciChartSurface in xaml. Now I want to apply some styles to my modfiers in xaml. Just creating styles with the specific target types don’t work so how do I do this?

  • Roland D asked 5 years ago
  • last active 5 years ago
1 vote
5k views

Hi, Support team.

I’m using MVVM pattern and trying to implement multi-chart which can insert Box Annotations at the same time into each chart .
So I’m testing in SciChart Example [“DigitalAnalyzerPerformanceDemo”] to know how to implement this.

But what i only got is just looping through and create annotation for each ChannelViewModels.

In the Demo, the VisibleRange ‘XRange’ is shared to all the ChannelViewModels by binding TwoWay-mode in ParentViewModel without looping for each ChildViewModels.
Like this, I wonder is there ways to apply BoxAnnotation all the ChannelViewModel at the same time by binding in ParentViewModel.

    <!-- BottomAxis -->
        <s:SciChartSurface Grid.Column="1">
            <s:SciChartSurface.XAxis>
                <s:NumericAxis Height="30"
                               AxisAlignment="Bottom"
                               VisibleRange="{Binding XRange, Mode=TwoWay}"                 
                               LabelProvider="{StaticResource TimeLabelProvider}"
                               MajorTickLineStyle="{StaticResource TimeAxisMajorTickLineStyle}"
                               MinorTickLineStyle="{StaticResource TimeAxisMinorTickLineStyle}"/>
            </s:SciChartSurface.XAxis>
            <s:SciChartSurface.YAxis>
                <s:NumericAxis Visibility="Collapsed"/>
            </s:SciChartSurface.YAxis>
        </s:SciChartSurface>
    </Grid>

    <!--  Create an X Axis with GrowBy  -->
     <s:SciChartSurface.XAxis>
           <s:NumericAxis Style="{StaticResource HiddenAxisStyle}"
                    VisibleRangeLimitMode="Min"
                    VisibleRangeLimit="0,0"
                    VisibleRange="{Binding DataContext.XRange, Mode=TwoWay, RelativeSource={RelativeSource AncestorType=ItemsControl, AncestorLevel=2}}"/>
     </s:SciChartSurface.XAxis>

I tried to bind annotation in ParentViewModel like XRange Binding method, But it doesn’t work.


This is View.xaml.

<Grid Grid.IsSharedSizeScope="True" IsEnabled="{Binding IsLoading, Converter={StaticResource InvertBooleanConverter}}">


    <!-- BottomAxis -->
        <s:SciChartSurface Grid.Column="1">
            <s:SciChartSurface.XAxis>
                <s:NumericAxis Height="30"
                               AxisAlignment="Bottom"
                               VisibleRange="{Binding XRange, Mode=TwoWay}"                 
                               LabelProvider="{StaticResource TimeLabelProvider}"
                               MajorTickLineStyle="{StaticResource TimeAxisMajorTickLineStyle}"
                               MinorTickLineStyle="{StaticResource TimeAxisMinorTickLineStyle}"/>
            </s:SciChartSurface.XAxis>
            <s:SciChartSurface.YAxis>
                <s:NumericAxis Visibility="Collapsed"/>
            </s:SciChartSurface.YAxis>
        </s:SciChartSurface>
    </Grid>

    <!-- Channels -->
        <ScrollViewer Background="#1C1C1E"
                      VerticalScrollBarVisibility="Auto"
                      HorizontalScrollBarVisibility="Disabled">

            <b:Interaction.Behaviors>
                <common:DigitalAnalyzerScrollBehavior ChannelHeightDelta="10" ChangeChannelHeightCommand="{Binding ChangeChannelHeightCommand}"/>
            </b:Interaction.Behaviors>

            <ItemsControl x:Name="chartItemsControl" ItemsSource="{Binding ChannelViewModels}">

                <b:Interaction.Behaviors>
                    <common:FocusedChannelScrollBehavior ScrollToFocusedChannel="False"/>
                </b:Interaction.Behaviors>

                <ItemsControl.ItemTemplate>
                    <DataTemplate DataType="{x:Type local:ChannelViewModel}">
                        <Grid Background="#2D2C32" Height="{Binding ChannelHeight, Mode=OneWay}" Focusable="False" UseLayoutRounding="False" >
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition SharedSizeGroup="ChannelNames" />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>

                            <Border BorderThickness="0,0,0,1" BorderBrush="#1C1C1E">
                                <DockPanel>
                                    <Border DockPanel.Dock="Left"     
                                            Background="{Binding ChannelColor, Mode=OneWay}" 
                                            Width="5"/>

                                    <TextBlock DockPanel.Dock="Left"
                                               Margin="10,5"
                                               VerticalAlignment="Center"
                                               Foreground="White"
                                               Text="{Binding ChannelName}"/>
                                </DockPanel>
                            </Border>

                            <s:SciChartSurface x:Name="channelSurface" Grid.Column="1"
                                               RenderableSeries="{Binding RenderableSeries}"
                                               Annotations="{s:AnnotationsBinding  DataContext.Annotations, Mode=TwoWay, RelativeSource={RelativeSource AncestorType=ItemsControl, AncestorLevel=2} }">

                                <!--  Create an X Axis with GrowBy  -->
                                <s:SciChartSurface.XAxis>
                                    <s:NumericAxis Style="{StaticResource HiddenAxisStyle}"
                                                   VisibleRangeLimitMode="Min"
                                                   VisibleRangeLimit="0,0"
                                                   VisibleRange="{Binding DataContext.XRange, Mode=TwoWay, RelativeSource={RelativeSource AncestorType=ItemsControl, AncestorLevel=2}}"/>
                                </s:SciChartSurface.XAxis>

                                <!--  Create a Y Axis with GrowBy. Optional bands give a cool look and feel for minimal performance impact  -->
                                <s:SciChartSurface.YAxis>
                                    <s:NumericAxis Style="{StaticResource HiddenAxisStyle}"
                                                   VisibleRange="{Binding YRange, Mode=OneWay}"/>
                                </s:SciChartSurface.YAxis>

                                <s:SciChartSurface.ChartModifier>
                                    <s:ModifierGroup s:MouseManager.MouseEventGroup="ChannelModifierGroup">
                                        <s:RubberBandXyZoomModifier IsAnimated="False" IsXAxisOnly="True" ZoomExtentsY="False" ReceiveHandledEvents="True" IsEnabled="{Binding IsChecked, Mode=OneWay, ElementName=IsZoomEnabled}"/>
                                        <s:ZoomPanModifier ZoomExtentsY="False" XyDirection="XDirection" IsEnabled="{Binding IsChecked, Mode=OneWay, ElementName=IsPanEnabled}"/>
                                        <s:ZoomExtentsModifier XyDirection="XDirection" IsAnimated="False" />
                                        <s:MouseWheelZoomModifier XyDirection="XDirection" />
                                    </s:ModifierGroup>
                                </s:SciChartSurface.ChartModifier>
                            </s:SciChartSurface>

                            <Border Grid.Column="1"
                                    BorderThickness="0,0,0,1"
                                    BorderBrush="#2D2C32"
                                    VerticalAlignment="Bottom"/>
                        </Grid>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </ScrollViewer>
    </Border>


</Grid>

This is ViewModel.cs

public class DigitalAnalyzerExampleViewModel : BaseViewModel
{
    private bool _isLoading;
    private DoubleRange _xRange;

    public DigitalAnalyzerExampleViewModel()
    {
        ChannelViewModels = new ObservableCollection<ChannelViewModel>();
        Annotations = new ObservableCollection<IAnnotationViewModel>();
        Annotations.Add(new BoxAnnotationViewModel() { X1 = 0, X2 = 1000, Y1 = 0, Y2 = 1 }); //I want to implement sharing annotation like this.

        SelectedChannelType = "Digital";
        SelectedChannelCount = 32;
        SelectedPointCount = 1000000;
        SelectedResamplingPrecision =ResamplingPrecision.Default;
        SelectedStrokeThickness = 1;

        ChangeChannelHeightCommand = new ActionCommand<object>((d) =>
        {
            var delta = (double)d;
            foreach (var channelViewModel in ChannelViewModels)
            {
                channelViewModel.SetChannelHeightDelta(delta);
            }
        });

        AddChannelCommand = new ActionCommand(async () =>
        {
            IsLoading = true;

            var isDigital = SelectedChannelType == "Digital";
            await AddChannels(isDigital ? 1 : 0, isDigital ? 0 : 1);

            IsLoading = false;
        });

        LoadChannelsCommand = new ActionCommand(async () =>
        {
            IsLoading = true;

            // Clear ViewModels
            foreach (var channelVm in ChannelViewModels)
            {
                channelVm.Clear();
            }
            ChannelViewModels.Clear();
            XRange = null;

            // Create a bunch of Digital channels
            await AddChannels(SelectedChannelCount, 0);

            XRange = new DoubleRange(0, SelectedPointCount);
            IsLoading = false;
        });

        LoadChannelsCommand.Execute(null);
    }


    public ObservableCollection<ChannelViewModel> ChannelViewModels { get; private set; }
    public ObservableCollection<IAnnotationViewModel> Annotations { get; private set; }

    public string SelectedChannelType { get; set; }


    public ResamplingPrecision SelectedResamplingPrecision { get; set; }

    public int SelectedChannelCount { get; set; }

    public ActionCommand<object> ChangeChannelHeightCommand { get; }

    public ActionCommand AddChannelCommand { get; }

    public ActionCommand LoadChannelsCommand { get; }

    public long TotalPoints => ChannelViewModels.Sum(c => (long)c.DataCount);

    public bool IsLoading
    {
        get => _isLoading;
        set
        {
            _isLoading = value;
            OnPropertyChanged(nameof(IsLoading));
        }
    }

    public bool IsEmpty => ChannelViewModels.Count <= 0;

    public DoubleRange XRange
    {
        get => _xRange;
        set
        {
            _xRange = value;
            OnPropertyChanged(nameof(XRange));
        }
    }
}

+Attached image below is what i want to implement.
++I also attached tried code in .zip .

1 vote
11k views

Hi,

I am having a problem with two SciChartSurface’s sharing the same ViewModel instance. I am using the Master-Detail View pattern to provide a list of charts (Collection of SciChart surfaces) with continuously updating data from a device) within a Listbox container on the left-hand side. On the right-hand side I provide the current selected chart with extended size and some extra controls.

The visual appearance of the SciChartSurface (shared across both sides) is defined via data template

<Window.Resources>
    <local:WorkspaceViewModel x:Key="WorkspaceViewModel" />
    <DataTemplate x:Key="ChartDataTemplate">
        <Border MinHeight="200">
            <visuals:SciChartSurface DebugWhyDoesntSciChartRender="True"
                                     visuals:ThemeManager.Theme="BrightSpark"
                                     SeriesSource="{Binding ., Mode=TwoWay}">
                <visuals:SciChartSurface.XAxis>
                    <visuals:NumericAxis VisibleRange="0.0, 10.0"
                                         AutoRange="Always" />
                </visuals:SciChartSurface.XAxis>

                <visuals:SciChartSurface.YAxis>
                    <visuals:NumericAxis VisibleRange="-1.0, 1.0"
                                         AxisAlignment="Left"
                                         AutoRange="Always" />
                </visuals:SciChartSurface.YAxis>
                <visuals:SciChartSurface.ChartModifier>
                    <visuals:SeriesValueModifier ReceiveHandledEvents="True"></visuals:SeriesValueModifier>
                </visuals:SciChartSurface.ChartModifier>
            </visuals:SciChartSurface>
        </Border>
    </DataTemplate>
</Window.Resources>

and is used within the ListBox and ContentControl in the following way

<Grid DataContext="{StaticResource WorkspaceViewModel}">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="200*"
                          MinWidth="225"
                          MaxWidth="700" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="375*" />
    </Grid.ColumnDefinitions>

    <GroupBox Grid.Column="0">
        <ListBox x:Name="ListBox"
            SelectedItem="{Binding SelectedChart}"
                 HorizontalAlignment="Stretch"
                 VerticalAlignment="Stretch"
                 ItemsSource="{Binding Charts}"
                 HorizontalContentAlignment="Stretch"
                 ItemTemplate="{StaticResource ChartDataTemplate}" />
    </GroupBox>
    <GridSplitter Grid.Column="1"
                  Width="5"
                  HorizontalAlignment="Right"
                  VerticalAlignment="Stretch"
                  ResizeBehavior="PreviousAndNext" />
    <GroupBox Grid.Column="2">
        <ContentControl x:Name="ContentControl"
            Content="{Binding SelectedChart}"
                        ContentTemplate="{StaticResource ChartDataTemplate}" />
    </GroupBox>
</Grid>

The ViewModel (WorkspaceViewModel) contains two properties:

ObservableCollection<ObservableCollection<IChartSeriesViewModel>> Charts
public ObservableCollection<IChartSeriesViewModel> SelectedChart

So far, so good. Once populated with live chart data, the ListBox displays all charts with live updating of the DataSeries. The issue I encounter is that once a chart in the ListBox is selected, the Detail View gets updated and continues displaying live data updates, but the ListBox entry stops updating. Obviously the sharing of the same instance of IChartSeriesViewModel in two different SciChartSurface views (via the ViewModel property SelectedChart) is causing trouble.

What am I missing here? I am currently using SciChart 3.0.

Many thanks,

Silvio

  • swiedric asked 10 years ago
  • last active 9 years ago
1 vote
2k views

Hello.
I’m just started to use SciChart and I have a question. How I can mirror XAxis in order to values will be increased from right to left. It is not negative scale but this view is more familiar for users (now I remake the old application). P.S. And be the best if additionally you show me how to make static XAxis with chosen range. I see the example in demo’s “Create Realtime Charts” section (my chart will be real-time too), but my application created via MVVM and I think this example not fully applicable to my case (but I fink after some investigation I will can remake example, but if you help me it be easier).

1 vote
8k views

Hi there,

We are looking for a high-performance charting library, hence Im testing scichart and I am very excited about it.

Our application has an very abstract processing mechanism which categorize incoming data and dynamically adds channels to the plot. Each sample is – like we call it – a ProcessedData object which is a base class containing extented information about the sample like “is valid” or “is out of range”. Eg. if measureing a voltage, we need to mark data points on the chart that are “out of range” or similar.
I’d thought to start with the “DragHorizontalThreshold” which uses the RedIfOverThresholdPaletteProvider to change the color of the plot.
Do you have an idea if it is possible to implement a custom PaletteProvider which takes respect of an IsValid-property? Acutally i do not have a clue how to.

Thanks.

  • Sven Fink asked 9 years ago
  • last active 9 years ago
0 votes
9k views

Hello!

I am getting started with SciChart and attempting to use it for a project I’m working on.

I am attempting to make a 3D scatter plot whose data is populated through a ViewModel.

Below is a my xaml:

 <UserControl x:Class="CustomWindow.Pages.Results_Page.Common_Tests.Positional6DOFErrorTest"
             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:enum="clr-namespace:MultiMet.Interfaces.Common;assembly=MultiMet.Interfaces"
             xmlns:xcdg="http://schemas.xceed.com/wpf/xaml/datagrid"
             xmlns:s3D="http://schemas.abtsoftware.co.uk/scichart3D"
             mc:Ignorable="d" 
             d:DesignHeight="360" d:DesignWidth="712">

    <Grid Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <!-- Some other stuff I'm doing on the page -->

        <s3D:SciChart3DSurface Grid.Column="1" ShowLicensingWarnings="True"
                        IsFpsCounterVisible="False"
                         IsAxisCubeVisible="True"
                         IsXyzGizmoVisible="False"
                         CoordinateSystem="RightHanded"
                               Background="White" RenderableSeries="{s3D:SeriesBinding RenderableSeries3DViewModels}">
            <!-- Create XAxis -->
            <s3D:SciChart3DSurface.XAxis>
                <s3D:NumericAxis3D TickTextBrush="Black" AxisTitle="X (mm)" DrawMajorBands="True" DrawMajorGridLines="True"
                        DrawMinorGridLines="True"
                        DrawMajorTicks="True"
                        DrawMinorTicks="True"
                        AxisBandsFill="Transparent"
                        FontSize="10"
                        TickLabelAlignment="Camera"
                                   GrowBy="0.1, 0.1"/>
            </s3D:SciChart3DSurface.XAxis>
            <!-- Create YAxis -->
            <s3D:SciChart3DSurface.YAxis>
                <s3D:NumericAxis3D AxisTitle="Z (mm)"
                        AxisBandsFill="Transparent"
                        TickTextBrush="Black"
                        FontSize="10"
                        TickLabelAlignment="Camera"
                                   GrowBy="0.1, 0.1"/>
            </s3D:SciChart3DSurface.YAxis>
            <!-- Create ZAxis -->
            <s3D:SciChart3DSurface.ZAxis>
                <s3D:NumericAxis3D AxisTitle="Y (mm)"
                        AxisBandsFill="Transparent"
                        TickTextBrush="Black"
                        FontSize="10"
                        TickLabelAlignment="Camera"
                                   GrowBy="0.1, 0.1"/>
            </s3D:SciChart3DSurface.ZAxis>

            <!-- Create Interactivity Modifiers for rotating camera -->
            <s3D:SciChart3DSurface.ChartModifier>
                <s3D:ModifierGroup3D>
                    <s3D:OrbitModifier3D ExecuteOn="MouseLeftButton" ExecuteWhen="None"/>
                    <s3D:MouseWheelZoomModifier3D MouseWheelSensitivity="90" />
                    <s3D:FreeLookModifier3D ExecuteOn="MouseRightButton"/>
                    <s3D:TooltipModifier3D IsEnabled="True" SourceMode="AllSeries" ShowTooltipOn="MouseOver"/>
                </s3D:ModifierGroup3D>
            </s3D:SciChart3DSurface.ChartModifier>
        </s3D:SciChart3DSurface>
    </Grid>
</UserControl>

And below I declare and define my scatter plot in the viewmodel (the scatterSeries is an XyzDataSeries3D set somewhere else) :

    PositionalErrorTestModel.RenderSeries3DViewModels = new ObservableCollection<IRenderableSeries3DViewModel>();
PositionalErrorTestModel.RenderSeries3DViewModels.Add(new ScatterRenderableSeries3DViewModel
            {
                PointMarker = new SpherePointMarker3D { Fill = System.Windows.Media.Color.FromRgb(0x78, 0xC3, 0), Size = 5, Opacity = 1 },
                DataSeries = scatterSeries
            });

The chart appears, but the data does not. Is there something I’m missing? Do I need to explicitly call an update to the chart? Because the page the chart is on and the chart does get loaded before the data is populated.

Please let me know if you need to know anymore information.

Thanks for any help you can provide!

0 votes
0 answers
5k views

I’ve been moving a project over to using MVVM, but I’ve found the IsStaticAxis option I was using in the NumericAxis doesn’t exist in the NumericAxisViewModel. Is it not possible to make the axis static with the View Models?

Showing 51 - 70 of 70 results

Try SciChart Today

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

Start TrialCase Studies