Tag: WPF

Hello guys !
I am looking at the Composite Annotation example provided with the SDK that I downloaded a few days back.

I am somewhat confused on what assemblies I will need . The assemblies list you use is extensive and it is unclear to me what assemblies I need to include to apply this to my plot implementation.

The namespace
SciChart.Examples.Examples.AnnotateAChart.CompositeAnnotations is what I am looking at and what in that list of assemblies will I need to include to successfully implement Composite Annotation in our application ?

I work with a few models and views. Two of them, the ChartView and the PlotView respectively handles the charting surface , then the surrounding toggle buttons and such belongs to the PlotView.

What would be your recommendation how to begin implement this ?

Appreciate the support
Thank you

Cheers
Anders

I’m adding an annotation to a chart with a DateTime x-axis. Without a label the annotation is successfully added. However, if I specify a label I get an InvalidOperationException when Add() is called. The exception message is “The Type this is a test is not a valid Comparable Type”}:

                var annotation = new VerticalLineAnnotation
                {
                    VerticalAlignment = VerticalAlignment.Stretch,
                    ShowLabel = true,
                    X1 = time.DateTime,
                    Stroke = System.Windows.Media.Brushes.Orange,
                    LabelPlacement = LabelPlacement.TopRight,
                    LabelValue = "this is a test",
                    LabelsOrientation = Orientation.Vertical
                };

                MyChart.Annotations.Add(annotation);

The LabelValue is obviously of type string and non-null and indeed of type IComparable. Any reason I can’t add it?

With fifocapacity(XyDataSeries), memory behaves like an image. (Repeat ups and downs)
Is this due to fifocapacity(XyDataSeries)?

Capture : x = minutes , y = MB

I have a custom annotation class that I would like to bind the geometries.

<Path.Data>

</Path.Data>

    public GeometryGroup Elements
    {
        get { return _elements; }
        set
        {
            _elements = value;
            InvokePropertyChanged("Elements");
        }
    }

When I create the class in code it only works if Path was set in xaml, doesn’t work if set in code.

            Path p = new Path();
            p.Data = Geometry.Parse("m 0 0 10 0 10 10 0 10 z");             
            GeometryGroup g = new GeometryGroup();
            g.Children.Add(p.RenderedGeometry);
            CustomPathAnnotation cpa = new CustomPathAnnotation()
            {
                Elements = g,
                X1 = .55,
                Y1 = .5, 
                CoordinateMode = AnnotationCoordinateMode.Relative,
                XAxisId = "DefaultAxisId",
                YAxisId = "DefaultAxisId",
                Visibility = Visibility.Visible
            };
            ChartAnnotation.Add(cpa);

Hi!

I would like to plot a series as a solid line AND include error bars. The way I do this now is to define a single series:

var fSeries    = new HlcDataSeries<double, double>();
fSeries.SeriesName = $"My Series!";

And then two different ViewModels:

var fLineVm = new LineRenderableSeriesViewModel();
var fErrorVm = new ErrorBarsRenderableSeriesViewModel();

And set the data series to belong to both:

fLineVm.DataSeries = fSeries;
fErrorVm.DataSeries = fSeries;

This looks ok. But when I show the legend, I see “My Series” in the legend twice, and I can control the error bars separately from the line series.

What I want to happen is that I see the series a single time in the legend and if I turn it off (uncheck it) everything disappears.

Right now, i’m adding those two ViewModels to an ObservableCollection of IRenderableSeriesViewModels and then SeriesBinding to display them.

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.

I am creating a graph for 10 data series using Scichart, with the most optimal legend placement for the graph being “Top” with Horizontal Orientation as shown in the code below. I would like to keep the spacing compact so all the data series can be visible without the need for the scrollbar, however because of the checkboxes for selecting each series being enabled I cannot compress the spaces to make all the data series visible. I did try using a custom legend with the typical binding but to no avail. I have attached an image of the current legend as well.

<s:LegendModifier Name="legendModifier" Margin="1" Width="1" ShowLegend="True" Orientation="Horizontal"
                                  HorizontalAlignment="Left" VerticalAlignment="Top"
                                  LegendPlacement="Top" ScrollViewer.HorizontalScrollBarVisibility="Auto"
                                  Visibility="Visible"/>

Is it possible to format the legend so as to keep all the series names visible while maintaining the checkboxes for displaying or hiding individual data series?

Hi,
I’m experimenting with the LegendModifier and want to control which RenderableSeries are shown via the “LegendItemTemplate” approach. The idea is to add a specific tagging class to the RenderableSeries.DataSeries.Tag and use the content inside the LegendItemTemplate which I define in the Window.Resouces.

The tagging Class:

public class DataSeriesTag
{
    public string LegendText { get; set; }
    public bool ShowLegend { get; set; }
}

The LegendItemTemplate:
<Window.Resources>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

            <!--<CheckBox Width="16" Margin="5,0,0,0"
                HorizontalAlignment="Left"
                VerticalAlignment="Center"
                IsChecked="{Binding RenderableSeries.IsVisible, Mode=TwoWay}"
                Visibility="{Binding RenderableSeries.DataSeries.Tag.ShowLegend, Converter={dxmvvm:BooleanToVisibilityConverter}}" />-->

            <s:PointMarker Grid.Column="1" Margin="5,0,0,0" Width="40" Height="10" VerticalAlignment="Center" HorizontalAlignment="Center"
              DataContext="{Binding RenderableSeries}"
              DeferredContent="{Binding LegendMarkerTemplate}"
              Visibility="{Binding ShowSeriesMarkers, RelativeSource={RelativeSource AncestorType=s:SciChartLegend}, Converter={dxmvvm:BooleanToVisibilityConverter}}" />

            <TextBlock Margin="5,0,5,0"
     Grid.Column="2"
     HorizontalAlignment="Left"
     Text="{Binding RenderableSeries.DataSeries.Tag.LegendText}" />

        </Grid>
    </DataTemplate>
</Window.Resources>

As long as I declare the SciChartSurface.ChartModifier in XAML, it works perfect.
The proplem raises when I bind the ModifierGroup to a ViewModel Property and try to build the LegendModifier there. How can I assign the LegendItemTemplate in the ViewModel?:

legendModifier = new LegendModifier(){
            ShowLegend = true,
            ShowVisibilityCheckboxes = false,
            LegendItemTemplate = ??????
        };
        TheModifiers.ChildModifiers.Add(legendModifier);

Kind regards
Martin

Is there a way to draw an svg formatted annotation onto a chart for WPF?

I have found references/examples for it in javascript here . . .

https://www.scichart.com/documentation/js/current/Tutorial%2006%20-%20Adding%20Annotations.html

but not for any other platform.

HI,
I’m new in scichart. I would like to ask you if it’s possible to build a graph with custom candles.
I want to build a footprint graph, something like this:

http://footprintchart.com/wp-content/uploads/2011/06/Shade_Dominant_Side.png

could you tell me if It’s possible to build this kind of graph and suggest me some links with documentation?

Thank you

Hi!

I have the following code for a vertical slice modifier

    <s:VerticalSliceModifier Name="sliceModifier"
                                             ReceiveHandledEvents="True"
                                             >
                        <s:VerticalSliceModifier.VerticalLines>
                            <s:VerticalLineAnnotation Style="{StaticResource sliceStyle}"
                                                      X1="{Binding ParentViewModel.SliceModifierPosition, Mode=TwoWay}" />
                        </s:VerticalSliceModifier.VerticalLines>

 </s:VerticalSliceModifier>

This results in a nullreference exception. When I remove the VerticalLines, there is no nullreference exception, also no vertical lines.
As far as I can see ParentViewModel.SliceModifierPosition, does not have a value at the time.

I tried setting the visibility of the slicemodifier to collapsed, but it did not help the exception. Is there any to remove the slicemodifier for the time when X1 is not valid (using MVVM and not binding the slicemodifier itself)?

nullreference exception location

Abt.Controls.SciChart.ChartModifiers.VerticalSliceModifier.TB()
: Abt.Controls.SciChart.ChartModifiers.VerticalSliceModifier.OnAttached()
: Abt.Controls.SciChart.ChartModifiers.ModifierGroup.TB(IChartModifier C)
: Abt.Controls.SciChart.Common.Extensions.EnumerableExtensions. <a href="IEnumerable1 , Action1″>
: Abt.Controls.SciChart.ChartModifiers.ModifierGroup.TB(IEnumerable`1 C)

Hi there,

I use SciChart v5.4.0.12119 trial to display FastLineRenderableSeries in my WPF application. It works with the default black background. But when I change the background to white (), the background gets messed up in white-black strips.

I tried to disable hardware acceleration. hwndSource.CompositionTarget.RenderMode = System.Windows.Interop.RenderMode.SoftwareOnly; It doesn’t help.

What could cause the issue?

Regards,
Jun

Hello,

I’m relatively new to SciChart and I’m facing a challenge with customizing the appearance of a dynamically created series that is bound to a SciChartSurface using SeriesBinding in WPF.

I have a VerticalSliceModifier in my XAML where I define a VerticalLineAnnotation. My series is created in code as a MountainRenderableSeriesViewModel and then bound to the chart using SeriesBinding. Here’s the relevant code snippets:

<s:SciChartSurface
    Grid.Row="1"
    Background="Transparent"
    BorderThickness="0"
    RenderableSeries="{s:SeriesBinding Series}"
    Annotations="{s:AnnotationsBinding Annotations}">

    <s:VerticalSliceModifier ShowTooltipOn="Never" Foreground="White" Name="sliceModifier">
        <s:VerticalSliceModifier.VerticalLines>
            <s:VerticalLineAnnotation X1="{Binding Number}" Style="{StaticResource sliceStyle}" />
        </s:VerticalSliceModifier.VerticalLines>
    </s:VerticalSliceModifier>

</s:SciChartSurface>


public class MountainRenderableSeriesViewModel
{
    public DataSeriesViewModel<double, double> DataSeries { get; set; }
    public DataTemplate RolloverMarkerTemplate { get; set; }
    // Other properties...

    public MountainRenderableSeriesViewModel()
    {
        // Initialize your DataSeries and other properties

        // Set the RolloverMarkerTemplate for this series
        RolloverMarkerTemplate = Application.Current.Resources["CustomRolloverMarkerTemplate"] as DataTemplate;
    }
}

My challenge is that I want to customize the RolloverMarkerTemplate for this dynamically created series. Most of the examples I’ve found show how to use RolloverMarkerTemplate with a statically defined series, but I cannot figure out how to assign it when the series is created in a ViewModel and bound to the chart using SeriesBinding.

Any guidance or code examples on how to achieve this customization would be greatly appreciated.

Hi,
I am currently facing an issue related to our implementation.
We want the graph to zoom in whenever the user drags the y-axis upward, and conversely, zoom out when the user drags the y-axis downward. Importantly, this behavior should remain consistent regardless of whether the user drags the graph from the positive or negative side.

Currently, I’m using a uniform heatmap to display images taken from a monochrome camera. I’m using a RubberBandXyZoomModifier to allow to user to zoom in on a region of interest in the image. The SciChartSurface is set to be 640×480 (the image size) and is hosted in a Viewbox, so it’s size scales uniformly with the grid that it’s in. The problem I’m facing is that when I zoom in, the zoomed part of the image stretches to fit the 640×480 size, changing the pixel aspect ratio, but I want the pixel aspect ratio to stay constant so they are all square. What I want to happen is that extra space is added either on the top/bottom or left/right of the zoomed part of the image so the pixel aspect ratio stays constant. See the attached image for a visual explanation. I think I either need to change the SciChartSurface size or the GridLinesPanel size to match the zoomed area size, but I’m not sure how to go about doing that. Is there a way to achieve this? Thanks!

Hello SciChart Team,
I have multiple charts in my application where all the charts are in the same MdofierGroup to show the RolloverModifier tooltip at the same time. As I want to show custom tooltip text, I have created a custom TooltipTemplate and TooltipContainerStyle. But now when the tooltip is shown on the left side the tooltip text is a long way from the marker. I want to align the tooltip text based on the tooltip position. When the tooltip is on the right side the text will be aligned left and when the tooltip is on left side the text will be aligned right.

I have attached some code snippets of my implementations, can you suggest me any way to achieve this?

<Style x:Key="_tooltipContainer" TargetType="scichart:TooltipControl">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="scichart:TooltipControl">
                    <ContentPresenter Content="{TemplateBinding DataContext}"
                                          ContentTemplate="{TemplateBinding ContentTemplate}" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <DataTemplate x:Key="_tooltipTemplate" DataType="scichart:XySeriesInfo">
        <StackPanel Orientation="Vertical">
            <TextBlock FontSize="12" FontFamily="Rubik" Foreground="White">
                <TextBlock.Text>
                    .
                    .
                    .
                </TextBlock.Text>
            </TextBlock>
        </StackPanel>
    </DataTemplate>

    <!-- Style applied via x:Key name in ViewModel -->
    <Style TargetType="scichart:BaseRenderableSeries"  x:Key="_lineSeriesStyle">
        <Setter Property="RolloverMarkerTemplate">
            <Setter.Value>
                <ControlTemplate>
                    <Ellipse Width="7" Height="7" Stroke="White" StrokeThickness="1" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>

        <Setter Property="scichart:RolloverModifier.TooltipContainerStyle" Value="{StaticResource _tooltipContainer}"/>
        <Setter Property="scichart:RolloverModifier.TooltipTemplate" Value="{StaticResource _tooltipTemplate}"/>
        <Setter Property="scichart:RolloverModifier.IncludeSeries" Value="True"/>
        <Setter Property="StrokeThickness" Value="2"/>
    </Style>


 <scichart:SciChartSurface RenderableSeries="{scichart:SeriesBinding ItsRenderableTimeGraphSeries}">


                                    <scichart:SciChartSurface.ChartModifier>
                                        <scichart:ModifierGroup DataContext="{Binding Path=DataContext, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}}}" 
                                                            scichart:MouseManager.MouseEventGroup="MouseEventGroup" >
                                            <scichart:RolloverModifier ShowTooltipOn="MouseHover" DrawVerticalLine="False" />
                                        </scichart:ModifierGroup>
                                    </scichart:SciChartSurface.ChartModifier>
.
.
.
</scichart:SciChartSurface>

In ViewModel:

ItsRenderableTimeGraphSeries = new ObservableCollection<IRenderableSeriesViewModel>
        {
            new MountainRenderableSeriesViewModel()
            {
                IsDigitalLine = false,
                StyleKey = "_lineSeriesStyle",
            }
        };

Has anyone encountered this before?

XamlParseException: Unexpected record in Baml stream. Trying to add to SciChartSurface which is not a collection or has a TypeConverter.

<DataTemplate x:Key="SciLineChartTemplate"><Grid><s:SciChartSurface ...

Hello,

I have a SciChartSurface with multiple StackedColumnRenderableSeries. The goal is to create a column style “Stacked Graph”.

The StackedColumnRenderableSeries are created this way:

private StackedColumnRenderableSeries[] m_layers = new StackedColumnRenderableSeries[0];
  -------
    while (num  > m_layers.Length)
              {                
                  StackedColumnRenderableSeries layer = new StackedColumnRenderableSeries()
                  {
                      DataPointWidth = 0.9,                  
                      Fill = new SolidColorBrush(DefaultMainColorOfCurrentSetting),
                      Stroke = Colors.Black,
                      ShowLabel = false  
                  };
  
                      layer.DataSeries = new XyDataSeries<double, double>();
                      layer.DataSeries.AcceptsUnsortedData = true;
  
                  m_sciChartSurface.RenderableSeries.Add(layer);
                 
                  List<StackedColumnRenderableSeries> temp = m_layers.ToList();
                  temp.Add(layer);
                  m_layers = temp.ToArray();
                 
              }
  

Later, they are fed data with this function:

void addBar(double[] layerValues)
          {
  
              using (m_sciChartSurface.SuspendUpdates())
              {   
                  for (int i = 0; i < m_layers.Length; i++)
                  {
                      XyDataSeries<double, double> data = (XyDataSeries<double, double>)m_layers[i].DataSeries;   
                      data.Append(m_currentTimepoint, layerValues[i]);
                  }
              }
  
              m_currentTimepoint++;
          }
  
  private int m_currentTimepoint = 1;
  

If I use this function within the class constructor, everything works as expected (see attached image).

However, sometimes, I receive the error message “”System.ArgumentException” in SciChart.Charting.dll The StackedColumnRenderableSeries type requires that all stacked stacked series with the same StackedGroupId have the same XValues.”

I fail to see the meaning of this message, since, the x-Value is the same for each part of the new column. Its “m_currentTimepoint”.

Additional Information:

This visualization is part of a medical monitoring software we are currently developing. If we use test data to call the addBar-Function (directly from the constructor, for example), the error does not appear. However, if we use data from our medical sensors, it appears. In both cases, the addBar-Function receives valid data (no NaN´s or such things)

The function is not called often, about once every 10 seconds.

Thank you

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!

I have a chart with multiple series, and I would like to have the RolloverModifier behavior for all selected series, but with a single tooltip combining the values for all selected series rather than a separate tooltip per series (similar to the CursorModifier)

Is there a way to do one of the following?

1. Merge the tooltips from the RolloverModifier?
   OR
2. Only show the vertical crosshair from the CursorModifier, and snap the crosshair to the closest point in the series?

The RolloverModifier is closer to the behavior I want, the only change I would want is the merged tooltip.

Hello,

I am currently working on a proof of concept to move make our software cross platform. Currently, we use the WPF charting package but we have the full bundle so we have access to all the charts. I’m working on a Maui Blazor app where the UI and its logic are stored in a razor class lib and most of the services are stored in the shared WebAssembly project. Ideally, I would like to create the chart data inside a service and then create the appropriate views for each platform using the platform specific charts. Eventually my plan is to have a Blazor WASM project that we host online (where users can view their data), a Maui app that will run on Windows and Mac, and a WPF app that will host the project on computers that aren’t running Windows 10 and 11.

Are there any plans to implement a shared library of some type for the IRenderableSeriesViewModel, IDataSeries, IPaletteProvider, etc. where we could reference these interfaces regardless of platform?

Thank you,

Tim Stephansen

My idea was to have two FastLineRenderableSeries that both share the same XyDataSeries. One series will display the data as-is as an absolute value, while the other will display the same data relative to some arbitrary value. Each series would get it’s own axis.

Is there a way to accomplish what I’m trying to do, or is there another approach that accomplishes the same thing?