Forums

I’m experimenting with creating a CustomRenderableSeries.

I was expecting VisualXcceleratorRenderSurface to perform the fastest. But what I am finding is that it is noticeably slower than XamlRenderSurface. By slower, I mean interaction with zoom/pan becomes choppy and resizing the window is choppy. Which is surprising because I’m really not rendering much at all.

We plan on rendering a lot more than this, but it already appears to struggling. Can you shed some light?

public class MyDataSeries : XyDataSeries<double>
{
    public MyDataSeries()
    {

    }
}

public class MyRenderableSeries : CustomRenderableSeries
{
    public MyRenderableSeries()
    {

    }

    protected override void Draw(IRenderContext2D renderContext, IRenderPassData renderPassData)
    {
        base.Draw(renderContext, renderPassData);

        if (DataSeries is not MyDataSeries series)
            return;

        using (var brush = renderContext.CreateBrush(Brushes.Red))
        using (var pen = renderContext.CreatePen(Colors.Black, true, 1))
        {
            for (int i = 0; i < series.Count; ++i)
            {
                double pos = (double)series.XValues[i];

                var x = renderPassData.XCoordinateCalculator.GetCoordinate(pos);
                var y = renderPassData.YCoordinateCalculator.GetCoordinate(pos);
                var s = renderPassData.XCoordinateCalculator.GetCoordinate(0) - renderPassData.XCoordinateCalculator.GetCoordinate(1);

                var points = CreateCircle(new Point(x, y), s);
                renderContext.FillPolygon(brush, points);
            }
        }
    }

    private List<Point> CreateCircle(Point pos, double radius)
    {
        var points = new List<Point>();

        int count = 1000;
        for (int i = 0; i < count; ++i)
        {
            double angle = (360.0 / count * i) * (Math.PI / 180);
            double x = Math.Cos(angle) * radius;
            double y = Math.Sin(angle) * radius;

            points.Add(new Point(pos.X + x, pos.Y + y));
        }

        points.Add(points[0]);

        return points;
    }
}

public class MyRenderableSeriesViewModel : BaseRenderableSeriesViewModel
{
    public override Type ViewType => typeof(MyRenderableSeries);
}

public class MyViewModel : BaseViewModel
{
    public List<IRenderableSeriesViewModel> RenderableSeriesViewModels { get; }

    public MyViewModel()
    {
        RenderableSeriesViewModels = new List<IRenderableSeriesViewModel>
        {
            Generate(Enumerable.Range(0, 25).Select(x => (double)x).ToArray()),
        };
    }

    private IRenderableSeriesViewModel Generate(double[] data)
    {
        var dataSeries = new MyDataSeries();
        dataSeries.Append(data, data);

        return new MyRenderableSeriesViewModel
        {
            DataSeries = dataSeries,
            StyleKey = "mySeriesStyle"
        };
    }
}


<UserControl x:Class="SciChart.Examples.Examples.SeeFeaturedApplication.Histogram.ViolinView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:s="http://schemas.abtsoftware.co.uk/scichart"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         xmlns:local="clr-namespace:SciChart.Examples.Examples.SeeFeaturedApplication.Histogram"
         mc:Ignorable="d">

<UserControl.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="/SciChart.Charting;component/Themes/Default.xaml" />
        </ResourceDictionary.MergedDictionaries>

        <Style TargetType="{x:Type local:MyRenderableSeries}"
               BasedOn="{StaticResource MvvmDefaultRenderableSeriesStyle}"
               x:Key="mySeriesStyle">
        </Style>
    </ResourceDictionary>
</UserControl.Resources>

<s:SciChartSurface x:Name="SciChart"
                   RenderableSeries="{s:SeriesBinding RenderableSeriesViewModels}">
    <s:SciChartSurface.RenderSurface>
        <s:VisualXcceleratorRenderSurface />
    </s:SciChartSurface.RenderSurface>

    <s:SciChartSurface.XAxis>
        <s:NumericAxis />
    </s:SciChartSurface.XAxis>

    <s:SciChartSurface.YAxis>
        <s:NumericAxis />
    </s:SciChartSurface.YAxis>
    <s:SciChartSurface.ChartModifier>
        <s:ModifierGroup>
            <s:ZoomPanModifier />
            <s:RubberBandXyZoomModifier ExecuteOn="MouseRightButton" />
            <s:ZoomExtentsModifier ReceiveHandledEvents="False" />
            <s:MouseWheelZoomModifier />
        </s:ModifierGroup>
    </s:SciChartSurface.ChartModifier>
</s:SciChartSurface>

I have tested this on 3 machines, and all show the same behaviour.

**VisualXcceleratorEngine: Creating VisualXcceleratorRenderSurface Visual Xccelerator Engine v7.0.1.27055

GPU Capability Test ### Is BGRA feature required: TRUE

Examining Graphics Adapter: Intel(R) Iris(R) Xe Graphics VRAM:
128Mb DeviceId: 39497

Visual Xccelerator Engine Direct3D9 Compatibility
Determines whether the adapter is blacklisted due to its unstable work… FALSE
Trying to create Direct3D9 Device… SUCCESS

Visual Xccelerator Engine Direct3D11 Compatibility
Trying to create Direct3D9Ex Device (WPF Compatibility)… SUCCESS
Trying to create Direct3D11 Device… SUCCESS

Rank: 3000128 Points

Examining Graphics Adapter: NVIDIA T500 VRAM: 1928Mb DeviceId:
8123

Visual Xccelerator Engine Direct3D9 Compatibility
Determines whether the adapter is blacklisted due to its unstable work… FALSE
Trying to create Direct3D9 Device… FAILED

Visual Xccelerator Engine Direct3D11 Compatibility
Trying to create Direct3D9Ex Device (WPF Compatibility)… FAILED
Trying to create Direct3D11 Device… SUCCESS

Rank: 3001928 Points

Examining Graphics Adapter: Microsoft Basic Render Driver VRAM: 0Mb
DeviceId: 140

Visual Xccelerator Engine Direct3D9 Compatibility
Determines whether the adapter is blacklisted due to its unstable work… FALSE
Trying to create Direct3D9 Device… FAILED

Visual Xccelerator Engine Direct3D11 Compatibility
Trying to create Direct3D9Ex Device (WPF Compatibility)… FAILED
Trying to create Direct3D11 Device… SUCCESS

Rank: 2000000 Points

Selected Graphics Adapter, where DeviceId is: 8123 Is Direct3D9
Supported: FALSE Is Direct3D11 Supported: TRUE Is Blacklisted:
FALSE

Please find the log file here:
C:\dev\TestApps\SciChart_Violin\bin\Debug\net6.0-windows\GpuCapability.log

**VisualXcceleratorEngine: SUCCESS! VisualXcceleratorRenderSurface: attempt to initialize the engine with parameters: Use Direct3D9 –
False

Hi Scichart Team.

I am working on the MouseWheelZoomModifier (EActionType.Pan).
But my users are using a trackpad (apple magic trackpad).
Currently, they are using 2 fingers and move up or down (vertically) to pan the chart. But they are asked to pan the chart by using 2 fingers and move left or right (horizontally) instead.

Do we have any setting for MouseWheelZoomModifier that help me pan the chart by that way?

Greetings,
i have three Series in a SciChart.js (Community-Version) Surface.
The Legend i added shows me all three of them and their names and checkboxes do hide or show the series.

Here is my problem: Is there a way to hide one Series (a FastCandlestickRenderableSeries) from the Legend? I only want to show the other two Series (FastLinerenderableSeries).

Somethin like a Parameter “showInLegend: false,”? I did not find something like this in the documentation(https://www.scichart.com/documentation/js/current/typedoc/classes/legendmodifier.html).

Thank you

I am considering applying server-side licensing for my javerScript application.

In the document below, there is a phrase “Our server-side licensing component is written in C++.”
(https://support.scichart.com/index.php?/Knowledgebase/Article/View/17275/7/scichartjs-domain-licensing-faq)

However, there is only asp.net sample code on the provided github.
(https://github.com/ABTSoftware/SciChart.JS.Examples/tree/master/Sandbox/demo-dotnet-server-licensing)

I wonder if there is a sample code implemented in C++ for server-side licensing.

Can you provide c++ sample code?
Also, are there any examples to run on Ubuntu?

I am working on a multithreaded application where the acquisition and chart display run on different threads. I am attempting to collect samples and plot only when I have 100 samples available to have less resource consumption and keep the application responsive. However, when I change the number of samples in the block, my FIFO capacity seems to change, allowing significantly less amount of samples than the ones I need. The current FIFO capacity should allow for at least 16 mins worth of data, but it only shows less than a second

If I set the block size to 1 (single sample appending) I obtain the results I need, but I am seeing performance issues in other areas of the program, hence the need of appending in blocks.

See the attachments for more clarity. Any suggestions?

EDIT: Adding code

private void DisplayNPD()
        {
            XyDataSeries<float, float> npdRawDataSeries = new XyDataSeries<float, float>();
            int fifoSize = 1000000;
            npdRawDataSeries.FifoCapacity = fifoSize;
            npdRawData_RS.DataSeries = npdRawDataSeries;

            double npdRaw = 0;
            bool successfulDequeue = false;
            int samplesQueued = 0;
            int samplesInBlock = 100;
            float[] rawSamples = new float[samplesInBlock];
            float[] time = new float[samplesInBlock];

            while (!ImagingSession.terminateThreads)
            {
                if (ImagingSession.laserOnOff && !graphRestarted)
                {
                    int npdElementsInQueue = npdDisplayQueue.Count;
                    if (npdElementsInQueue > 0)
                        successfulDequeue = npdDisplayQueue.TryDequeue(out npdRaw);

                    if (successfulDequeue)
                    {
                        currentTime = graphStopwatch.ElapsedMilliseconds * 0.001;
                        time[samplesQueued] = (float) currentTime;
                        rawSamples[samplesQueued] = (float) (npdRaw * 1000);

                        samplesQueued++;
                        if (samplesQueued == samplesInBlock)
                        {
                            using (npdRawDataSeries.SuspendUpdates())
                                npdRawDataSeries.Append(time, rawSamples);
                            samplesQueued = 0;

                            if (currentTime > upperLimit)
                            {
                                lowerLimit = upperLimit;
                                upperLimit += xAxisWidth;
                                AdjustXAxis(currentHorizontalScale);
                            }
                        }
                    }
                }
            }
        }

Hello,

I want to render a base64 image in ScichartJS without actually rendering it in DOM. I saw that you have these guides in WPF:
https://support.scichart.com/index.php?/Knowledgebase/Article/View/17213/34/
https://www.scichart.com/documentation/win/current/webframe.html#Screenshots,_Printing_and_Export_to_XPS.html

However it is difficult to achieve it in Typescript. Is there a guide or any ideas on how to do it? I would appreciate any answer.

Hello, I am using SciChartJS and have a new requirement from our users as follows that I need help with the implementation. Any pointers from anyone would be a great help.

**Requirements: **

• Assume that x-axis is Time and y-axis is prices.
• There are multiple series in the chart (e.g., Bid Price, Ask Price)
• Allow user to select a time on xAxis using CTRL + CLICK
• When the user selects the time, show the rollover line and the tooltip for all series at the selected time
• This rollover line and tooltip should remain visible until the user selects a new time on the x-axis at which point the rollover tooltip should display the tooltip for the new point.

I started inheriting the RolloverModifier but couldn’t find an appropriate method to show the tooltip.

So, I started implementing the above feature using CustomModifierBase2d and adding a VerticalLineAnnotation for the rollover line. But again, struggling with the tooltip.

If someone could help me out or give me pointers, that would be highly appreciated.

Best Regards,
Sachin Patel.

Hi, I’m looking for a way to programmatically dismiss a RolloverModifier from a chart. I’ve been tasked with creating a user experience that does two things: 1. when a user stops scrubbing on the chart, the rollover modifier should persist, and 2. when the user taps outside of the chart the rollover modifier should disappear.

I’ve accomplished the first part of the problem by implementing a subclass of SCIRolloverModifier and overriding the onEvent(args:) function, but I cannot figure out how to dismiss the rollover modifier when the user taps outside the chart surface.

Is there a way to accomplish this?

I have a use case for a chart, that is a heatmap, which may also contain multiple series drawn on top, with multiple internal axis as well.
I can’t transform the data I receive, because that would be too slow, and it needs to maintain a speedy feeling, even when appending more data.

For this reason, when building the chart, I just flip the axis. The bottom axis is the Y axis, and the left axis it the X axis.

The multiple series that can be added (XyDataSeries), provide one extra axis each, and use one of the main axis.
We can think of them as horizontal or vertical series, depending if they use the main X axis, or the main Y axis.

When hovering over the chart, I want to show a tooltip, that shows for each series, their own axis value.

The issue — The normal CursorModifier, can’t correctly present a tooltip, for this case of mixed horizontal/vertical series. I’m not sure if there are configurations I’m missing, or if it is an actual uncovered edge case, hoping to get an answer on this.

To show what the issue is, and how I’m currently fixing it, please have a look at the codepen I made -> https://codepen.io/jrfv/full/zYMjEzP

Any tips on this, is it something scichart will fix eventually?

How can i modify candlestick item so it will have rounded corners? Like in linked image

Greetings! I see you have support Xamarin.iOS and Xamarin.Android, however, I’m not sure about support status: do you support .NET 7 iOS and Android?

Hello,
tell me please, how can I add such indicators on yAxis. Maybe you have some example on sandbox for JS.

Thank you!

I created a simple .NET6 WPF application and added the SciChart assembly references. I call SciChartSurface.SetRuntimeLicenseKey(…) in App constructor and run the application. I get the following exception:

*System.TypeInitializationException: The type initializer for ‘njm’ threw an exception. Source=SciChart.Core

Inner Exception 1:
InvalidOperationException: babel m0 7238858: Method not found: ‘System.Reflection.Emit.AssemblyBuilder System.AppDomain.DefineDynamicAssembly(System.Reflection.AssemblyName, System.Reflection.Emit.AssemblyBuilderAccess)’.

Inner Exception 2:
MissingMethodException: Method not found: ‘System.Reflection.Emit.AssemblyBuilder System.AppDomain.DefineDynamicAssembly(System.Reflection.AssemblyName, System.Reflection.Emit.AssemblyBuilderAccess)’.*

Everything works well if I use SciChart in a .NET4.8 WPF application. How can I fix this? Thanks.

We’re working on a Nyquist plot using the latest SciChart SDK for WPF.
We have quite a MVVM dependent structure already in place.

We are working with 3D frequency based Complex data. The Nyquist plot would have 2 axes – Y for Imaginary values and X axis for Real values. We apply some averaging and post-processing of the 3D data to put in 2D form and show it in the Nyquist plot.

However, we’d like to be able to scroll the data at certain frequency ranges without showing the actual frequency graph in the plot. Is there a possibility to implement an independent scrollbar containing a averaged magnitude graph (similar idea to the processing of the Nyquist data) over a frequency range? We’d like to scroll this frequency range and on selected range changed to recalculate data in the Nyquist plot.

We have quite an extensive graphing structure implemented already. The main issue I’m currently facing is that the scrollbar is bound to the SciChartSurface and I cannot seem to figure out how to build it more like a “sexy” frequency range selector while staying within the SciChart library? Is there any possibility to not be bound to the SciChartSurface? And of course, the axes are quite different – in the Nyquist we have linear real and imaginary values (-2 to +2, for example) whereas the frequency range would extend much further data-wise (0 – 3000 Hz, for example).

Any help would be appreciated. Feel free to ask for more details.

Hello,

Python with Matplotlib allows us to draw a line series that has multiple color depending on something else as shown below (https://matplotlib.org/3.3.0/gallery/lines_bars_and_markers/multicolored_line.html):

Is it possible with SciChart (WPF version)?

Is there any way to write data labels in Android? I know it exists in JavaScript, but I can’t find a way to do it in Android.

I build a .net6.0 project, and add an scichart, when I set the min of visible range of Axis to a bit less than 0, for example -1, the first tick will be zero ,but will show as -0, which is very weird.

And the situation occurs on demo of Scichart, too.

Please tell me, is it possible to make sure that there is no empty space between records on those days when there is no trading on the stock exchange? It appears that the X-axis is linear and not transactional. How can I make it transactional?

https://www.scichart.com/questions/wpf/i-want-to-bind-selectedpointmarkers-of-datapointselectionmodifier

Hello.
Referring to the link above, we have modified the ViewModel side to maintain the selection state of chart points.

It works fine for a single chart, but when I have multiple charts, the selection points are interlocked between charts. I would like them to be independent of each other.

I wasn’t sure if there was a problem with my code or with the DataPointSelectionModifier, so does anyone know?

I have attached a code sample and a GIF of a working image.

※To reproduce this, click the three points in order from the top while holding down the control key on “Chart1” to make the three points selected. The color of the points will change from blue to red.
Next, while holding down the control key in “Chart2,” click on the bottom point. Then, in “Chart2,” four points are selected, even though only one point is pressed in total.

That is all. Best regards.

I work on a SwiftUI project that has integrated SciCharts.

What I’ve noticed is that while there are SwiftUI examples available, they are rather basic and when I replicate the example code over in my project, it does not run as we expect and in some cases does not run at all.

Currently there seems to be issues with the SwiftUI run loop, SwiftUI’s use of structs, and SciCharts use of pointers that make building complex charts within complex user interfaces rather challenging.

I needed to do a lot of work to get the SwiftUI example code to work in my project, and we’re still facing some challenges. Can we expect better SwiftUI support in the future, such as SwiftUI views included in the SDK or if this work has been done can the documentation be linked?

I am using ImpulseSeries3Dgraph in some positions labels are overlapping on the graph, is there any way to increase the space between axis labels and the graph? please look into the attached image.

Hello support team,

I’m using a SciChartSurface Chart with a CategoryDateTimeAxis (xAxis).
The chart should contain three stacked bar columns and Annotations between the columns.

How can I place the Annotations exactly between the columns with consideration of the dynamic width of chart surface? I haven’t found the exactly property or solution for this particular case.

Thanks for your support in advanced!

Hello there,

I am new to SciChart and trying to implement custom SCICursorModifiers tooltip,

It’s almost done, except one issue, i.e I am not able to hide the X axis (or) Horizontal line which is in green colour, it is showing up in the background whenever I am trying to use the tooltip.

The line which needs to be hidden

I tried with following below code but it is not working

extension SCIChartTheme {
    static let berryBlue: SCIChartTheme = SCIChartTheme(rawValue: "SciChart_SciChartv4DarkStyle")
}

SCIThemeManager.addTheme(.berryBlue, from: Bundle.main)

Is there any way to achieve this

Thanks in Advance

I have a scatterplot with different series of points and I need to figure out a way to draw each point separately in a different Z order. This will acheive “layering” of the points based on some metadata criteria.

The main issue to solve here is as follows. Each series can have “highlighted” points (outlined in blue on the chart, uses SciChart point selection) and “selected” points (denoted by a star point marker) which are tied to a selection in a grid. Any point in any of the series can be Highlighted and/or Selected. I need the the non-selected and non-highlighted points to be drawn first, then the selected points, then the highlighted points. This would guarantee that the highlighted points are always drawn on top of all others, and the selected points drawn on top of all but the highlighted.

My attempt has been to create a custom chart modifier and override OnParentSurfaceRendered. In that method I build dictionaries of points based on the metadata grouping criteria, then start with the lowest Z index group (the non-highlighted and non-selected points) draw those points, and continue up to the highest Z order group (the highlighted points).

Is there a simpler way to achieve this point layering functionality across data series?

Thanks.

I’m using the ZoomHistoryManager in my application which works great!

But how can I add my own entry to the undo/redo stack?

On my viewmodel I have

 /// <summary>
/// XAxisRange
/// </summary>
public DoubleRange? XAxisRange
{
    get => _xAxisRange;
    set => SetProperty(ref _xAxisRange, value);
}

private DoubleRange? _xAxisRange = null;

/// <summary>
/// YAxisRange
/// </summary>
public DoubleRange? YAxisRange
{
    get => _yAxisRange;
    set => SetProperty(ref _yAxisRange, value);
}

private DoubleRange? _yAxisRange = null;

and I want to implement something like :

 public void CustomRangeUpdate()
{
    if (RenderableSeries.Count > 0)
    {

        XAxisRange = new DoubleRange(x1, x2);
        YAxisRange = new DoubleRange(y1, y2);

        ZoomHistoryManager.SaveLatestRange(new AxisKey("DefaultAxisId", true), XAxisRange);
        ZoomHistoryManager.SaveLatestRange(new AxisKey("YAxis", false), YAxisRange);
        ZoomHistoryManager.PushAll();
    }
}

But it looks like I am using it incorrectly as it doesn’t add any entries. I’ve also tried Push() with no luck

We have been testing different limits of data types we are aiming to draw to the chart, and have found that if all of the values in a series are the same, very near 0, float value, then the line isn’t drawn. We do, however, get the value showing up on the vertical line annotation.

Though we are not using the latest version of SciChart in our production app (Net 4.6.1 requirement, but upgrading that soon), I have managed to reproduce the same in a very simplified .Net7 app using the latest version (7.0.2.27161). I have attached both the test app (with my runtime key removed) and a screenshot of the app.

Here is the code we are using to generate the sample series in the code behind of MainWindow.xaml:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        this.Loaded += OnLoaded;
    }

    private void OnLoaded(object sender, RoutedEventArgs routedEventArgs)
    {
        var floatData = new XyDataSeries<double, float>();

        for (var i = 0; i < 1000; i++)
        {
            floatData.Append(i, float.Parse(Math.Pow(2, -126).ToString("E")));
        }

        this.FloatSeries.DataSeries = floatData;
    }
}

MainWindow.xaml contains just a SciChart Surface, as follows:

<s:SciChartSurface x:Name="Surface">
            <s:SciChartSurface.RenderableSeries>
                <s:FastLineRenderableSeries x:Name="FloatSeries" 
                                            Stroke="#FF4083B7"/>
            </s:SciChartSurface.RenderableSeries>

            <s:SciChartSurface.XAxis>
                <s:NumericAxis AutoRange="Always"/>
            </s:SciChartSurface.XAxis>

            <s:SciChartSurface.YAxis>
                <s:NumericAxis AutoRange="Always"/>
            </s:SciChartSurface.YAxis>

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

                    <s:VerticalSliceModifier>
                        <s:VerticalSliceModifier.VerticalLines>
                            <s:VerticalLineAnnotation X1="500" 
                                                      IsEditable="True"
                                                      LabelTextFormatting="E"
                                                      Stroke="White" />
                        </s:VerticalSliceModifier.VerticalLines>
                    </s:VerticalSliceModifier>
                </s:ModifierGroup>
            </s:SciChartSurface.ChartModifier>

            <s:SciChartSurface.Annotations>
                <s:TextAnnotation Text="Test app highlighting problem when all x values are floats with the same scientific value"
                                  CoordinateMode="Relative"
                                  X1="0" 
                                  Y1="0"
                                  Margin="2"/>
            </s:SciChartSurface.Annotations>
        </s:SciChartSurface>

Adding another value to the series with result in the line being drawn, as long as it is sufficiently different to the others.

What would be the best way to get this data showing to the users? Whilst highly unlikely the user is going to use such values, we cannot discount this. Would extending the ViewportManager to provide our own range be the best approach? If it impacts on the suggestions, due to our implementation requirements our production app will only show up to two series per surface (with the same data type), but we could be showing upwards of 256 charts (with one of 12 data types as their y-axis type). All of our charts are linked to a common TimeSpanAxis for the x axis.