Forums

Hello,

Out team have several question about the framework:

1. Is there a way to make SCIChartSurfaceView background transparent so that the user could see underlying views? We tried using background brush of clear color on SCIChartSurface and making SCIChartSurfaceView backgroundColor transparent but no avail.

2. Is it possible to add translate/rotate/scale animation to markers/annotations from code?

3. When using gradient brush with mountain renderable series we found a strange visual artifact (“Gradient artifact” image). Is there a way to fix it?

Best regards,
Vasiliy

In your custom overview example the width of the grid column used as padding is linked to the width of the y axis.

            <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <!--  Hosts overview control  -->
            <ColumnDefinition Width="{Binding ActualWidthValue, ElementName=proxy, Mode=OneWay, Converter={StaticResource DoubleToGridLengthConverter}}" />
            <!--  Used to bind to parent surface YAxis  -->
        </Grid.ColumnDefinitions>

        <!-- This class is in the Examples Source Code, under your install directory -->
        <helpers:ActualSizePropertyProxy x:Name="proxy" Element="{Binding ElementName=MainChartSurface, Path=YAxis}" />

What do you use for the Path if you have multiple y axes. I have tried objects like AxisAreaLeft with no success.

Hi,

I’m using the following code to create a text annotation:

private void AddLabel(DateTime StartTime, DateTime EndTime, string label)
{
    TextAnnotation text = new TextAnnotation();
    text.YAxisId = "LeftAxis";
    text.HorizontalContentAlignment = System.Windows.HorizontalAlignment.Center;
    text.Text = label;
    text.CoordinateMode = AnnotationCoordinateMode.RelativeY;
    text.X1 = StartTime;
    text.X2 = EndTime;
    text.Y1 = .05;
    text.Y2 = 0;
    text.TextAlignment = TextAlignment.Center;
    text.TextStretch = Stretch.UniformToFill;
    text.Background = new SolidColorBrush(Color.FromArgb(0x80, 0x80, 0x80, 0x80));
    text.BorderBrush = new SolidColorBrush(Color.FromArgb(0xC0, 0xD0, 0xD0, 0xD0));
    text.BorderThickness = new Thickness(2);
    sciChart.Annotations.Add(text);
}

Unfortunately the text doesn’t scale like I want it to though. The size of the text stays the same even when the chart is small, making the height greater than .05. Is there a way to make the text get smaller as the chart is shrunk so that it stays within the .05 Y boundary?

I attached 2 images to illustrate the issue.

Thanks,
Greg

I have a chart that I would like the Y Axis to start at zero but the max size automatically since I don’t know the extent of the values that will be added. How do I do this?

Hi.

I am evaluating the SciChart control – so far it looks very promising.

I have a FastHeatMapRenderableSeries that is analyzed and a FastLineRenderableSeries line is drawn through the chart.

The user needs to be able to correct the analysis, and this is done by “drawing” in the heatmap.

As far as I could tell, the ChartModifierBase gives med the necessary hooks to track the user’s mouse movements – but I would like to give some visual feedback by changing the cursor, for instance to Cursors.Pen (Cursors from the Microsoft namespace)

Is this possible? I would want to enable drawing when user presses Ctrl, the disable it when user releases Ctrl…

I am using the MVVM pattern.

I trying to manage the number of YAxes in my chart in a dynamic manner by binding the YAxes in the chart to a collection so that each time I add a new line series that line series gets its own axis.

When I do this I am getting a null reference expection.
If I hard code the YAxes or YAxis my chart loads.

Here is the xaml:

<SciChart:SciChartSurface x:Name="historicalChart" 
    RenderableSeries="{Binding HistoricalRenderableSeries, Mode=TwoWay}"
    YAxes="{Binding ChartYAxes, Mode=TwoWay}"
    SciChart:ThemeManager.Theme="ExpressionLight">
   ...
</s:SciChartSurface>

Here is the ViewModel

I tried both an ObservableCollection and a AxisCollection in my view model.

private ObservableCollection<NumericAxis> _chartYAxes = new ObservableCollection<NumericAxis>();
public ObservableCollection<NumericAxis> ChartYAxes
{
  get { return _chartYAxes; }
  set
  {
    _chartYAxes = value;
    NotifyPropertyChanged("ChartYAxes");
  }
}

private AxisCollection _chartYAxes = new AxisCollection();
public AxisCollection ChartYAxes
{
  get { return _chartYAxes; }
  set
  {
    _chartYAxes = value;
    NotifyPropertyChanged("ChartYAxes");
  }
}

Can anyone suggest a way to manage a variable number of YAxes in a chart?

Right now i’m using trial version but i’m looking forward to buy full version as to integrate the charts in my app . I am building an real time chart that update data according to time , which means simply i need Time on the x axis and numeric values on the y axis , but i’m not getting any hint how to get the time values on the x axis .

Hi,

I have a surface with multiple dataseries in it. I have a legend for each serie, setup like this:

chart.ChartModifier = new Abt.Controls.SciChart.ChartModifiers.LegendModifier() { Name = "legendModifier" };

var legend = new Abt.Controls.SciChart.Visuals.SciChartLegend { Margin = new Thickness(5) };

// Bind the legend to the data source
var legendDataBinding = new Binding("LegendData") { Source = chart.ChartModifier };
legend.SetBinding(Abt.Controls.SciChart.Visuals.SciChartLegend.LegendDataProperty, legendDataBinding);

And it works fine.
However, I would also like to bind the visibility of the legends to the visibility of the dataseries. I have tried this:

// Bind the legend visibility to the data source
var legendVisibilityBinding = new Binding("Visibility") 
{ 
    Converter = new BoolToVisibilityConverter(),
    
    Source = line.IsVisible
};
legend.SetBinding(Abt.Controls.SciChart.Visuals.SciChartLegend.LegendDataProperty, legendVisibilityBinding);

But it doesn’t seem to work, any suggestions, anyone?

BR
Jacob

Hello everybody,

my project is very similar to “Quad Left-Right Y-Axes”-Example. If you have a look at this, the Gridlines only math the Left Axis 1. All other Axes have their Major/Minor Ticks randomly spread. It’s not easy to see fast what value has another series then the first because the Gridlines simply dont match.

Is there a way to have all the Major/Minor Ticks Aligned to the Left Axis 1 ones? (i attached a picture which it should look like) But the Series don’t have the same Range. So the Major steps should only match in Grid, not in value (except 0 should be on one line).

I hope you understand my problem.

thx in advance for help

PS: i use full dynamic MVVM approach, the only code in View is ->

<s:SciChartSurface
Style="{StaticResource SciChartSurfaceStyle}"
GridLinesPanelStyle="{StaticResource GridLinesPanelStyle}"
ChartModifier="{Binding chartModifier}"
SeriesSource="{Binding seriesSource}"
YAxes="{Binding yAxes}"
XAxes="{Binding xAxes}"
Annotations="{Binding annotations}"
>
</s:SciChartSurface>

I am using MVVM and am having problems and need you to have a quick look please as this is substantial

1)Run Solution

2)Click on Load, browse to folder Configuration\20120814 and select OK

3) 6 data series will load, the program then adds random data for each trace. The point count for each trace is shown on the form

4) After a few minutes, the update speed of the points reduces (this is not intended) the counter should update each second

5) when the count reaches about 16000 the program is pretty well locked up and non responsive.

It may well be a problem that I have introduced, at least I hope it is, as our intended application will be using very large data sets
Please could you have a look ASAP and get back to me

You have also not replied to the annotation problem I explained in another thread, I sent you example code to show you the problem

Thanks

I’m trying out polar chart for my specific needs. In my scenario x-axis needs to display 0-360 (angle) values starting from bottom and going counter-clockwise so that 0 is at the bottom, 90 is at right, 180 is at the top and so on. Looking at polar chart default x-axis display it starts from right and go clockwise. Is there any way to change this behavior?

In my project the output panel showing the following binding errors

System.Windows.Data Error: 40 : BindingExpression path error: 'Exponent' property not found on 'object' ''DefaultTickLabelViewModel' (HashCode=56110932)'. BindingExpression:Path=Exponent; DataItem='DefaultTickLabelViewModel' (HashCode=56110932); target element is 'TextBlock' (Name=''); target property is 'Text' (type 'String')
System.Windows.Data Error: 40 : BindingExpression path error: 'HasExponent' property not found on 'object' ''DefaultTickLabelViewModel' (HashCode=56110932)'. BindingExpression:Path=HasExponent; DataItem='DefaultTickLabelViewModel' (HashCode=56110932); target element is 'TextBlock' (Name='exponent'); target property is 'Visibility' (type 'Visibility')
System.Windows.Data Error: 40 : BindingExpression path error: 'Separator' property not found on 'object' ''DefaultTickLabelViewModel' (HashCode=9331561)'. BindingExpression:Path=Separator; DataItem='DefaultTickLabelViewModel' (HashCode=9331561); target element is 'TextBlock' (Name=''); target property is 'Text' (type 'String')

my Line chart view code is here (I can’t able to make attachment)

<UserControl x:Class="Instron.Database.Presentation.DatabaseViews.Views.Visualization.LineChartView"
             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:SciChart="clr-namespace:Abt.Controls.SciChart;assembly=Abt.Controls.SciChart.Wpf.3.0"
             xmlns:s="http://schemas.abtsoftware.co.uk/scichart" 
             mc:Ignorable="d" Width="Auto" Height="Auto"   
             xmlns:gbl="clr-namespace:Instron.Database.Presentation.DatabaseViews.Globalization">

    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="ContentControlDataTemplate.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>

    <Grid >

        <TextBlock  FontSize="24" 
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    TextWrapping="Wrap"   
                    Foreground="DimGray"
                    Visibility="{Binding IsAxisVisible,Converter={StaticResource  NotBooleanToVisibilityConverter}}" >
                    <TextBlock.Text>
                        <gbl:TranslateExtension>
                            <gbl:TranslateExtension.DesignTimeText>Either X or Y axis do not contain sufficient data</gbl:TranslateExtension.DesignTimeText>
                            <gbl:TranslateExtension.StringId>010000123</gbl:TranslateExtension.StringId>
                        </gbl:TranslateExtension>
                    </TextBlock.Text>
        </TextBlock>

        <s:SciChartSurface x:Name="sciChart" ChartTitle="{Binding ChartName}" Style="{StaticResource SciChartSurfaceStyle}"   Visibility="{Binding IsLegendVisible,Converter={StaticResource  BoolToVisibilityConverter}}" 
            GridLinesPanelStyle="{StaticResource GridLinesPanelStyle }"  RenderableSeries="{Binding RenderableSeries}"  Margin="0,-5,0,-10"
               DataContextChanged="sciChart_DataContextChanged" Rendered="sciChart_Rendered"  ViewportManager="{Binding ViewportManager}">

            <s:SciChartSurface.ContextMenu>
                <ContextMenu >
                    <MenuItem  Command="{Binding SaveAsCommand}">
                        <MenuItem.Header>
                            <gbl:TranslateExtension>
                                <gbl:TranslateExtension.DesignTimeText>SaveAs</gbl:TranslateExtension.DesignTimeText>
                                <gbl:TranslateExtension.StringId>010000126</gbl:TranslateExtension.StringId>
                            </gbl:TranslateExtension>
                        </MenuItem.Header>
                    </MenuItem>
                    <MenuItem  Command="{Binding CopyCommand}">
                        <MenuItem.Header>
                            <gbl:TranslateExtension>
                                <gbl:TranslateExtension.DesignTimeText>Copy</gbl:TranslateExtension.DesignTimeText>
                                <gbl:TranslateExtension.StringId>010000127</gbl:TranslateExtension.StringId>
                            </gbl:TranslateExtension>
                        </MenuItem.Header>
                    </MenuItem>
                    <MenuItem  Command="{Binding PrintCommand}">
                        <MenuItem.Header>
                            <gbl:TranslateExtension>
                                <gbl:TranslateExtension.DesignTimeText>Print</gbl:TranslateExtension.DesignTimeText>
                                <gbl:TranslateExtension.StringId>010000128</gbl:TranslateExtension.StringId>
                            </gbl:TranslateExtension>
                        </MenuItem.Header>
                    </MenuItem>
                </ContextMenu>
            </s:SciChartSurface.ContextMenu>

            <s:SciChartSurface.XAxis>
                <s:NumericAxis  AutoTicks="False" GrowBy="0.05, 0.05"  
                                DrawMajorGridLines="{Binding IsLegendVisible}"  DrawMinorGridLines ="False"
                                AxisTitle="{Binding XAxisName}"  TitleStyle="{StaticResource AxisTitleStyle}" TickLabelStyle="{StaticResource AxisLabelStyle}" 
                                LabelProvider="{Binding XLabelFormatter}"
                                MajorDelta="1" MinorDelta="0.2"
                                 />
            </s:SciChartSurface.XAxis>

            <s:SciChartSurface.YAxis>
                <s:NumericAxis  GrowBy="1, 1" TickLabelStyle="{StaticResource AxisLabelStyle}" DrawMajorGridLines="{Binding IsLegendVisible}"
                                AxisAlignment="Left"  DrawMinorGridLines ="False"
                                AxisTitle="{Binding YAxisTitle}" 
                                TitleStyle="{StaticResource AxisTitleStyle}" />
            </s:SciChartSurface.YAxis>

            <!--  Adding the ZoomPanModifier gives SciChart the ability to pan on mouse-drag  -->
            <s:SciChartSurface.ChartModifier>
                <s:ModifierGroup>
                    <s:XAxisDragModifier ClipModeX="ClipAtExtents"/>
                    <s:YAxisDragModifier ClipToBounds="True" />
                    <s:RubberBandXyZoomModifier x:Name="rubberBandZoomModifier" IsEnabled="True" IsXAxisOnly="False" ZoomExtentsY="False" IsAnimated="True"/>
                    <s:ZoomExtentsModifier x:Name="zoomExtentsModifier" ClipToBounds="True" ExecuteOn="MouseDoubleClick"/>
                    <s:LegendModifier x:Name="legendModifier" GetLegendDataFor="AllVisibleSeries" />
                </s:ModifierGroup>
            </s:SciChartSurface.ChartModifier>

        <s:SciChartSurface.Annotations>
                <s:CustomAnnotation>
                    <s:CustomAnnotation.ContentTemplate>
                        <DataTemplate>
                            <s:SciChartLegend  x:Name="legendControl" Margin="2,2" Orientation="Horizontal"  Background="Transparent" BorderThickness="0" ScrollViewer.VerticalScrollBarVisibility="Auto"
                                Visibility="{Binding IsLegendVisible,Converter={StaticResource  BoolToVisibilityConverter}}" 
                                LegendData="{Binding LegendData, ElementName=legendModifier,Mode=OneWay}" >

                                <s:SciChartLegend.Resources>
                                    <SciChart:ColorToBrushConverter x:Key="ColorToBrushConverter"/>
                                </s:SciChartLegend.Resources>
                                <s:SciChartLegend.ItemTemplate>
                                    <DataTemplate DataType="SciChart:XyzSeriesInfo">
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="Auto" />
                                                <ColumnDefinition Width="Auto" />
                                            </Grid.ColumnDefinitions>
                                           <Rectangle Grid.Column="0"
                                                VerticalAlignment="Center"
                                                Stretch="Fill"
                                                Width="10"

                                                StrokeThickness="10"
                                                Stroke="{Binding SeriesColor,
                                                Converter={StaticResource ColorToBrushConverter}}" />
                                            <TextBlock Grid.Column="1" Foreground="Black" 
                                                Margin="2,0,15,0"
                                                HorizontalAlignment="Center"
                                                Text="{Binding SeriesName}" FontWeight="Normal"/>
                                            </Grid>
                                    </DataTemplate>
                                </s:SciChartLegend.ItemTemplate>
                            </s:SciChartLegend>
                        </DataTemplate>
                    </s:CustomAnnotation.ContentTemplate>
                </s:CustomAnnotation>
            </s:SciChartSurface.Annotations>
        </s:SciChartSurface>
    </Grid>
</UserControl>

I made an example based on the “Vertically Stacked Axes” from SciChart Examples. The main difference is that I can add DataSeries / YAxes on the fly.

The problem is that when I set VisibleRange and VisibleRangeLimit it does not crop the trace (as you can see on the Tan traces that are drawn on the whole surface).

Is there any way to crop the traces to VisibleRange of corresponding Axis?

I want some specific behavior out of my X and Y axes. Right now I have custom code which modifies the ranges for the axes to get the behavior I want. It would be nice to just do this by setting options on the axes.

For my Y axis I want to use the AutoRange feature but the default seems a little crowded. Instead of it ranging to the min and max of the data series I want it to show a little room on the top and bottom.

For the X axis I want to show exactly the most recent hour of data.

Thanks for any help.

Hi, I am displaying no of BoxAnnotation , I want to link some of the BoxAnnotation randomly .I want to perform the operaton on annotation with relation.When it move BoxAnnotation,related link should also move accordingly.I am also performing Y axis with yaxisID so Annotation also move to Y direction with Y axis.
Please help me out.
Thanks