SciChart® the market leader in Fast WPF Charts, WPF 3D Charts, and iOS Chart & Android Chart Components
Questions
Hi,
I have multiple dataseries of around 20,000 points each, and the calculation of each point originates from one of three sources. I would like to show, for each point, a different data point marker depending on the origin of the point. Each point marker should also show some meta data about the calculation origin in a tooltip when it is moused over.
I have been able to achieve this effect using the Annotations API, as shown here: http://s4.postimg.org/otgc4yk3x/markers.png but chart performance grinds to a halt with an AnnotationCollection of up to 100,000 annotations attached to the surface.
Can I show this information in another way that will be performant, taking advantage of virtualisation, efficient algorithms on sorted data etc.? I was thinking that I may be able to add the point origins as metadata to the XyDataSeries, benefit from the performance optimisations that come with a SciChart series, and show the metadata in DataPointMarkers with tooltips? Could this work? Can I also have a differently shaped datapoint marker for each point depending on the metadata?
Thanks 🙂
- Robert Evans asked 4 years ago
- You must login to post comments
Hi Robert,
Sounds like this might benefit from one of the following APIs in SciChart:
PaletteProvider API
The PaletteProvider API allows you to draw a different colour for each data-point of a series. Supported series in v3.2 include Line, Column, Mountain, Scatter, Candlestick, Ohlc. In v3.1 fewer series are supported.
You can see an overview of the API at Change Series Colour Dynamically (PaletteProvider) and a live demo at the Using PaletteProvider Example.
If you use this technique, I would propose having a FastLineRenderableSeries and separate XyScatterRenderableSeries which has the same data and a palette provider to colour the points.
CustomRenderableSeries API
Using our RenderContext you can draw to the screen directly. Please see CustomRenderableSeries API Overview and Creating a Custom Spline Line Series.
If you scroll down to the section Drawing Point Markers it shows how to draw markers at data-points.
If you use this technique I would recommend inheriting FastLineRenderableSeries and re-using the base.InternalDraw() method, but implementing your own code to just draw point markers afterwards.
I hope this helps, and if you get a good solution, feel free to share it so others can benefit!
- Andrew answered 4 years ago
- Hi Robert, for metadata on hover, please see this thread https://www.scichart.com/questions/question/correlating-metadata-with-datapoints
- Hi Andrew, I've been going down the XyScatterRenderableSeries route, but I've run into an issue. I can plot the data, but it's all invisible because I can't set the PointMarker from the code. I need to do it from the code because the chart is dynamic, i.e. I add series and data on the fly, and xaml is too static. I found this question from two years ago: https://www.scichart.com/questions/question/using-xyscatterrenderableseries-with-chartseriesviewmodel which had the same problem, but the solution looks kind of complex. Do you know if there is a better way to do it today? Thanks again.
- Actually never mind, I just found the Abt.Controls.SciChart.Visuals.PointMarkers namespace: new XyScatterRenderableSeries { PointMarker = new Abt.Controls.SciChart.Visuals.PointMarkers.CrossPointMarker(), DataSeries = series };
- Hi Robert, That's the trick. Also note you can create your own point markers, just inherit BasePointMarker and override DrawInternal(), e.g. CrossPointMarker is implemented like this
public class CrossPointMarker : BasePointMarker { /// <summary> /// When overridden in a derived class, draws the point markers at specified collection of <see cref="Point" /> centers /// </summary> /// <param name="context">The RenderContext to draw with</param> /// <param name="centers">The Centres of the point markers</param> /// <param name="pen">The default Stroke pen (if current pen is not set)</param> /// <param name="brush">The default Fill brush (if current brush is not set)</param> /// <seealso cref="IRenderContext2D" /> /// <seealso cref="IPen2D" /> /// <seealso cref="IBrush2D" /> protected override void DrawInternal(IRenderContext2D context, IEnumerable<Point> centers, IPen2D pen, IBrush2D brush) { foreach (var center in centers) { DrawInternal(context, center.X, center.Y, pen, brush); } } protected override void DrawInternal(IRenderContext2D context, double x, double y, IPen2D pen, IBrush2D brush) { var halfWidth = (float)(Width * 0.5); var halfHeight = (float)(Height * 0.5); context.DrawLine(pen, new Point((x - halfWidth), y), new Point((x + halfWidth), (y))); context.DrawLine(pen, new Point(x, (y - halfHeight)), new Point(x, (y + halfHeight))); } } - I've got a solution that works for me - I used a FastLineRenderableSeries and three separate XyScatterRenderableSeries (one for each kind of point marker). Using separate XyScatterRenderableSeries means that I can change the shape as well as the colours of the point markers. I haven't implemented tooltips over the scatter points yet, but I guess I can do that with the Hit test API.
- 1 more comment
- You must login to post comments
Hi,
This is nearly very useful for us.
What we need is an impulse chart, with different colour and shape per point (as well as the x and y values). So I guess that would require 4 values to be associated with each point, and those four values to all be passed to the GetColor and DrawInternal methods. And it would require the impulse chart type to support the pallette provider api.
Is this functionality that could be added?
- F W answered 4 years ago
- Hi Felix, The impulse chart type does support the PaletteProvider API, but only with X,Y values. What you want can be achieved with a CustomRenderableSeries, by copying/modifying the FastImpulseRenderableSeries code. It's not possible out of the box though by changing just properties of the series.
- OK, I'll take a look, thanks!
- You must login to post comments
Please login first to submit.