Forums

Hi,

I observed a weird behavior with custom pointmarkers in SciChart. The issue is related to the previous one I reported, so I will not post my code snippets here, because it’s actually the same code as in the link. However, it is a different kind of issue, so I thought I should start a new thread.

Description (I attached a .gif to illustrate the issue):
Inside my RenderSurface, I have some pointmarkers which are filled with a transparent color and others which are filled with the color of the stroke of this pointmarker. Whether or not the pointmarker is filled depends on the IPointMetaData object attached to the point (and the meta data won’t change in any way).
When the chart gets displayed I have 4 pointmarkers visible. All 4 are filled, BUT only the leftmost SHOULD be filled. When I now scroll the chart to the right so that the leftmost pointmarker is not visible anymore the 3 remaining pointmarkers lose their fill and are now displayed as they should. Scrolling the first one back in the get filled again. I can only assume that this is maybe caused by SciChart cacheing some resources internally?

Important: I did only observe this issue with the Direct3D10RenderSurface. Everything works as expected with the other three surface types.

Edit:
seems like the gif animation does not work, so I added two more pictures.

DiaryPointMarker.cs

public class DiaryPointMarker : BasePointMarker
{
    private IList<IPointMetadata> _dataPointMetadata;
    IList<int> _dataPointIndexes = new List<int>();

    private readonly List<Point> _points = new List<Point>();

    public bool UseClustering { get; set; }
    public bool IndicateCommentWithFill { get; set; }

    private IPen2D _lowStrokePen;
    private IPen2D _midStrokePen;
    private IPen2D _highStrokePen;


    private IBrush2D _lowRatingColor;
    private IBrush2D _midRatingColor;
    private IBrush2D _highRatingColor;
    private IBrush2D _noCommentColor;

    public Brush LowRatingColor { get; set; }
    public Brush MidRatingColor { get; set; }
    public Brush HighRatingColor { get; set; }

    public override void BeginBatch(IRenderContext2D context, Color? strokeColor, Color? fillColor)
    {
        _dataPointMetadata = RenderableSeries.DataSeries.Metadata;

        _dataPointIndexes = new List<int>();
        _points.Clear();

        base.BeginBatch(context, strokeColor, fillColor);
    }


    public override void MoveTo(IRenderContext2D context, double x, double y, int index)
    {
        if (IsInBounds(x, y))
        {
            _dataPointIndexes.Add(index);
            _points.Add(new Point(x,y));
        }

        if (UseClustering)
        {
            base.MoveTo(context,x,y,index);
        }
    }

    public override void EndBatch(IRenderContext2D context)
    {
        if (UseClustering)
        {
            base.EndBatch(context);
        }
        else
        {
            Draw(context, _points);
            context.SetPrimitvesCachingEnabled(false);
        }
    }

    public override void Draw(IRenderContext2D context, IEnumerable<Point> centers)
    {
        TryCasheResources(context);

        var markerLocations = centers.ToArray();

        for (int i = 0; i < markerLocations.Length; ++i)
        {
            var diaryMetaInfo = _dataPointMetadata[_dataPointIndexes[i]] as DiaryPointMetaData;

            var center = markerLocations[i];

            var strokePen = diaryMetaInfo.Rating < 60
                ? _lowStrokePen
                : diaryMetaInfo.Rating < 80 ? _midStrokePen : _highStrokePen;
            var fillBrush = diaryMetaInfo.Rating < 60
                ? _lowRatingColor
                : diaryMetaInfo.Rating < 80 ? _midRatingColor : _highRatingColor;

            context.DrawEllipse(
                strokePen,
                IndicateCommentWithFill ? (String.IsNullOrEmpty(diaryMetaInfo.Comment) ? _noCommentColor : fillBrush) : fillBrush,
                center,
                Width,
                Height
                );
        }
    }

    private void TryCasheResources(IRenderContext2D context)
    {
        _lowStrokePen = _lowStrokePen ?? context.CreatePen(LowRatingColor.ExtractColor(), AntiAliasing, (float)StrokeThickness, Opacity);
        _midStrokePen = _midStrokePen ?? context.CreatePen(MidRatingColor.ExtractColor(), AntiAliasing, (float)StrokeThickness, Opacity);
        _highStrokePen = _highStrokePen ?? context.CreatePen(HighRatingColor.ExtractColor(), AntiAliasing, (float)StrokeThickness, Opacity);

        _lowRatingColor = _lowRatingColor ?? context.CreateBrush(LowRatingColor);
        _midRatingColor = _midRatingColor ?? context.CreateBrush(MidRatingColor);
        _highRatingColor = _highRatingColor ?? context.CreateBrush(HighRatingColor);
        _noCommentColor = _noCommentColor ?? context.CreateBrush(Color.FromArgb(0, 0, 0, 0));
    }
}

Hi Guys

I am using an ItemsControl to display a collection of SciStockCharts. I want to be able to use a single SciChartOverview (not part of the Item Template) to set the visible range on all of the charts displayed in the ItemsControl. Is this possible and if so how would I go about achieving it.

Thanks in advance
Regards
Ian Carson

Hi,

I ran into a problem with EllipsePointMarkers when I have a big amount of PointMarkers inside the Rendersurface. Here is a brief description of what I am trying to do:

1. I created a custom BasePointMarker-derived class which draws Ellipses with a varying Color – depending on some threshold defined in the IPointMetaData implementation

2. Everything works fine as long as the points are not tightly spaced between each other. That said, when I rescale my Rendersurface, the points get shifted so that the red points (who are below the threshold) will move up and suddenly green points are at minimum YValue positions.

I attached two pictures which hopefully illustrate my problem better than my words can do. Maybe somebody knows a workaround / fix for this problem. Any help is appreciated! ( I assume it has sth to do with the RescaleMode which prevents some points from being drawn to the surface and shifts others so that the Chart isn’t too dense)

Best,
Matthias

Update
Since Andrew suggested that the behavior comes from my custom code (which is hopefully true), here are the relevant parts:

DiaryView.xaml

<s:SciChartSurface Grid.Row="1" Grid.Column="0"
                       s:ThemeManager.Theme="Chrome"
                       Background="White" RenderableSeries="{s:SeriesBinding DiarySeriesViewModels}">
        <s:SciChartSurface.RenderSurface>
            <s:HighQualityRenderSurface/>
        </s:SciChartSurface.RenderSurface>
        <s:SciChartSurface.YAxis>
            <s:NumericAxis AxisAlignment="Left" DrawMajorBands="False" VisibleRange="0,900"/>
        </s:SciChartSurface.YAxis>
        <s:SciChartSurface.XAxis>
            <s:DateTimeAxis DrawMajorBands="True" VisibleRangeLimit="{Binding VisibleRangeLimit}"
                            DrawMinorGridLines="False"
                            x:Name="XAxis"
                            CursorTextFormatting="dd.MM.yyyy HH:mm"/>
        </s:SciChartSurface.XAxis>
    </s:SciChartSurface>

DiaryViewModel.cs

Property:

    public List<IRenderableSeriesViewModel> DiarySeriesViewModels { get; private set; }

inside the Constructor:

this.DiarySeriesViewModels.Add(new LineRenderableSeriesViewModel()
        {
            AntiAliasing = true,
            PointMarker = new DiaryPointMarker()
            {
                AntiAliasing = true,
                LowRatingColor = Brushes.Red,
                MidRatingColor = Brushes.Orange,
                HighRatingColor = Brushes.Green,
                Width = 10,
                Height = 10,
                StrokeThickness = 2
            },
            DataSeries = GetSampleSeries()
        });

GetSampleSeries():

private XyDataSeries<DateTime, double> GetSampleSeries()
    {
        var series = new XyDataSeries<DateTime, double>();

        var startDate = this.VisibleRangeLimit.Min.AddDays(5);
        var currentDate = startDate;
        int i = 0;
        while (currentDate < DateTime.Now)
        {
            var yval = 60*(Math.Log(i))*Math.Abs(Math.Sin(Math.PI*(i++/100.0)));
            currentDate = currentDate.AddHours(5.3);
            string comment = i%20 == 0 ? String.Format("Sample comment #{0}", i) : string.Empty;
            double rating = 100*yval/60;
            series.Append(currentDate,yval,new DiaryPointMetaData(rating,comment));
        }

        return series;
    }

DiaryPointMarker.cs: (based on an example which I found here at SciChart)

public class DiaryPointMarker : BasePointMarker
{
    private IList<IPointMetadata> _dataPointMetadata;
    IList<int> _dataPointIndexes = new List<int>();


    private IPen2D _lowStrokePen;
    private IPen2D _midStrokePen;
    private IPen2D _highStrokePen;


    private IBrush2D _lowRatingColor;
    private IBrush2D _midRatingColor;
    private IBrush2D _highRatingColor;
    private IBrush2D _noCommentColor;

    public Brush LowRatingColor { get; set; }
    public Brush MidRatingColor { get; set; }
    public Brush HighRatingColor { get; set; }

    public override void BeginBatch(IRenderContext2D context, Color? strokeColor, Color? fillColor)
    {
        _dataPointMetadata = _dataPointMetadata ?? RenderableSeries.DataSeries.Metadata;

        _dataPointIndexes = new List<int>();

        base.BeginBatch(context, strokeColor, fillColor);
    }


    public override void MoveTo(IRenderContext2D context, double x, double y, int index)
    {
        if (IsInBounds(x, y))
        {
            _dataPointIndexes.Add(index);
        }

        base.MoveTo(context, x, y, index);
    }

    public override void Draw(IRenderContext2D context, IEnumerable<Point> centers)
    {
        TryCasheResources(context);

        var markerLocations = centers.ToArray();

        for (int i = 0; i < markerLocations.Length; ++i)
        {
            var diaryMetaInfo = _dataPointMetadata[_dataPointIndexes[i]] as DiaryPointMetaData;

            var center = markerLocations[i];

            context.DrawEllipse(
                diaryMetaInfo.Rating < 60 ? _lowStrokePen : diaryMetaInfo.Rating < 80 ? _midStrokePen : _highStrokePen,
                String.IsNullOrEmpty(diaryMetaInfo.Comment) ? _noCommentColor : diaryMetaInfo.Rating < 60 ? _lowRatingColor : diaryMetaInfo.Rating < 80 ?_midRatingColor : _highRatingColor,
                center,
                Width,
                Height
            );
        }
    }

    private void TryCasheResources(IRenderContext2D context)
    {
        _lowStrokePen = _lowStrokePen ?? context.CreatePen(LowRatingColor.ExtractColor(), AntiAliasing, (float)StrokeThickness, Opacity);
        _midStrokePen = _midStrokePen ?? context.CreatePen(MidRatingColor.ExtractColor(), AntiAliasing, (float)StrokeThickness, Opacity);
        _highStrokePen = _highStrokePen ?? context.CreatePen(HighRatingColor.ExtractColor(), AntiAliasing, (float)StrokeThickness, Opacity);

        _lowRatingColor = _lowRatingColor ?? context.CreateBrush(LowRatingColor);
        _midRatingColor = _midRatingColor ?? context.CreateBrush(MidRatingColor);
        _highRatingColor = _highRatingColor ?? context.CreateBrush(HighRatingColor);
        _noCommentColor = _noCommentColor ?? context.CreateBrush(Color.FromArgb(0, 0, 0, 0));
    }
}

hi, i have some issues with SciChartScrollbar control. i’m trying to use it like in the Custom Overview demo, but with possibility to contol zoom programmatically (by keyboard). So i bound SciChartScrollbar control’s property

Axis ="{Binding ElementName =XAxis}"

where XAxis is the axis from the top chart

     < s: SciChartSurface.XAxis >
        < s: NumericAxis x: Name ="XAxis"
                       DrawMinorGridLines ="True"
                       DrawMinorTicks ="True">
        </ s: NumericAxis >
    </ s: SciChartSurface.XAxis >

and then i change VisibleRange of top chart from code behind (previously i tried this without Scrollbar.SelectedRange)

        MainChartSurface.XAxis.VisibleRange.Min = Scrollbar.SelectedRange.Min = ((SpectraAnalysisTools )VM.AnalysisTools).ZoomMin;
        MainChartSurface.XAxis.VisibleRange.Max = Scrollbar.SelectedRange.Max = ((SpectraAnalysisTools )VM.AnalysisTools).ZoomMax;

eventually the top chart’s zoom works perfect but the bottom scrollbar moves only first time when value changed and never more again.
So my question is – what should i do to make the scrollbar control (like in Custom Overview demo) working with controlling from codebehind?

Hi Support,

I am trying to use the AxisMarkerAnnotation object inside a chart but I am facing a problem that I would be thankful if you can solve it.

I am adding the marker without any problems and it looks equals to the marker that you have into examples :

I am trying to find a way to remove/hide/use the green boxes on front but I did not find a way to do it.

can you help me please?

Thanks in advance.

Carlos.

Is there any documentation besides the tutorials? Something like the one found on MSDN, with all the Properties of the SciChart elements that can be styled.

I’m new to SciCharts, so this might be a terminology issue or something like that.

I’m trying to add a vertical line annotation to my chart that the user can drag around. So far so good. However, I’d like it to also display the values of the series data the line intersects with. This is where I’m unsure of the best way to proceed. What I want is basically the behavior of the RolloverModifier, which displays tooltips when it intersects with series data, but it’s always visible rather than triggered by a rollover. It may be possible to use the RolloverModifier for this, but I ran into an issue where I couldn’t have both a VerticalLineAnnotation with IsEditable=true and a RolloverModifier, and I need to add another VerticalLineAnnotation in addition to this one.

Any advice?

Hopefully I just missed something in the documentation.

From reading the material on the site I know how to do what I want to do in xaml:

    <Style x:Key="AxisLabelStyle" TargetType="s:DefaultTickLabel">
    <Setter Property="RenderTransform">
        <Setter.Value>
            <RotateTransform Angle="30"/>
        </Setter.Value>
    </Setter>
    <Setter Property="HorizontalAnchorPoint" Value="Left"/>
</Style>

Now however my chart will be using two diffrent x-axis, one numeric and one with date and time. Both axis are defined in code:

            _xAxisNum = new NumericAxis
        {
            ...
        };

        _xAxisDat = new DateTimeAxis
        {
            ...
        };

        InitializeComponent();
        sciChartSurface.XAxis = _xAxisDat;

What code must I add to my x-axes to get the same result as the xaml above accomplishes? Or can I achieve what I want with a LabelProvider?

Hi

I want to override the default AxisLabelTemplate for a DateTimeAxis beyond the normal circumstances.
Setting the AxisLabelTemplate to a StaticResource is easy enough, but all I have inside the Template is the CursorFormattedDataValue and I want to be able to send in something more then a simple string.

<ControlTemplate x:Key="RolloverModifierAxisLabelTemplateDefault">
    <Border Background="LightGray" 
            Opacity="0.80" 
            BorderThickness="0"
            CornerRadius="5"
            Padding="2"
            Visibility="{Binding IsXAxis, Converter={StaticResource BoolToVisibilityConverter}}">
        <TextBlock Text="{Binding CursorFormattedDataValue}" />
    </Border>
</ControlTemplate>

Extending the LabelProviderBase gives me the opportunity to override the FormatCursorLabel method, but it only returns a string and not an object and therefore I can not pass my own data structure to be used inside the AxisLabelTemplate.

How can we solve this issue? Is there a workaround, or is this something you need to implement?

I want to color individual points in the line. How can it be done with the SciChart?

Attached is an image of what I want to accomplish.

Thanks.

Hi Guys,

My Sci Chart has dates along the X-Axis. So far my data is at week level (one point for each week).

Ideally I would like to have a subtle grid line at each week, a more noticeable grid line to represent the start of each month, and a major grid line to represent the start of each year.

I understand that the current implementation of the XAxis seems to only use Minor and Major gridlines.

I am interested in drawing grid lines such that:

one minor vertical grid-line is drawn on the start of each week
one medium vertical grid-line is drawn on the start of each month
one major vertical grid-line is drawn on the start of each year
And for these grid lines to be drawn regardless of the current visible range or “zoom” of the chart.

Is there a simple tutorial or some snippet of code illustrating what I need to overwrite in a custom class in order to get this functionality into my chart?

Thanks again,
Miles

I have a lot of data to process and I don’t want UI to get frozen. So I’d like to add data in a background thread.

Is it possible to append data to XyDataSeries in a separate thread? Is it supposed to handle this safely?

Hi,

I added VerticalLineAnnotation to my SciChartSurface with multiple FastLineRenderableSeries. This is working fine, but I can’t figure out how to show the corresponding Y values at side of vertical line. (Each Dataserie has its own YAxes.)

I Found a place in VerticalLineAnnotations template, where I can insert a stackpanel or something to show the values, but I don’t know how to make the data binding work.

I want to do something like in the attached picture.

Best Regards,
Martti