Pre loader

Highlight Markers

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums

Answered
1
0

I’ve created a custom CHartmodifier like:

http://support.scichart.com/index.php?/Knowledgebase/Article/View/17255/32/custom-chartmodifiers—part-6—select-data-points-via-mouse-drag

My chart has different Markers: Point,Square and TrianglePointMarkers

How can I highlight this different markers (Fill gray if selected)?

  • You must to post comments
Best Answer
1
0

Hi Daniel,

In the sample ChartModifiers Part 6 – Select Data Points via Mouse Drag we use the RenderContext API to draw directly onto the bitmap, to highlight the selected points. Here is our code from the sample

/// <summary>
/// Called when the parent <see cref="SciChartSurface" /> is rendered. Here is where we draw selected points
/// </summary>
/// <param name="e">The <see cref="SciChartRenderedMessage" /> which contains the event arg data</param>
public override void OnParentSurfaceRendered(SciChartRenderedMessage e)
{
    base.OnParentSurfaceRendered(e);
 
    var selectedPoints = this.SelectedPoints;
    if (selectedPoints == null) return;
 
    double size = SelectedPointSize;
 
    // Create Fill brush for the point marker
    using (var fill = e.RenderContext.CreateBrush(SelectedPointColor))
    {
        // Iterating over renderable series
        foreach (var renderSeries in selectedPoints.Keys)
        {
            // Create stroke pen based on r-series color
            using (var stroke = e.RenderContext.CreatePen(renderSeries.SeriesColor, true, 1.0f))
            {
                // We need XAxis/YAxis.GetCurrentCoordinateCalculator() from the current series (as they can be per-series)
                // to convert data points to pixel coords
                var xAxis = renderSeries.XAxis;
                var yAxis = renderSeries.YAxis;
                var xCalc = xAxis.GetCurrentCoordinateCalculator();
                var yCalc = yAxis.GetCurrentCoordinateCalculator();
 
                var pointList = selectedPoints[renderSeries];
 
                // Iterate over the selected points
                foreach (var point in pointList)
                {
                    // Draw the selected point marker
                    e.RenderContext.DrawEllipse(
                        stroke, 
                        fill, 
                        new Point(xCalc.GetCoordinate(point.XValue), yCalc.GetCoordinate(point.YValue)),
                        size, 
                        size);                                                        
                }
            }                    
        }
    }
}

To extend this to draw other shapes, e.g. Triangle, or Square Point marker, did you know you can actually instantiate a *PointMarker and use it to draw to the context? Try this code:

double size = SelectedPointSize;

var defaultPointMarker = new EllipsePointMarker();
defaultPointMarker.Width = size;
defaultPointMarker.Height = size;

// Create Fill brush for the point marker
using (var fill = e.RenderContext.CreateBrush(SelectedPointColor))
{
    // Iterating over renderable series
    foreach (var renderSeries in selectedPoints.Keys.Cast<BaseRenderableSeries>())
    {
        // Create stroke pen based on r-series color
        using (var stroke = e.RenderContext.CreatePen(renderSeries.SeriesColor, true, 1.0f))
        {
            // We need XAxis/YAxis.GetCurrentCoordinateCalculator() from the current series (as they can be per-series)
            // to convert data points to pixel coords
            var xAxis = renderSeries.XAxis;
            var yAxis = renderSeries.YAxis;
            var xCalc = xAxis.GetCurrentCoordinateCalculator();
            var yCalc = yAxis.GetCurrentCoordinateCalculator();

            var pointList = selectedPoints[renderSeries];

            var pointMarker = renderSeries.PointMarker ?? defaultPointMarker;

            // Iterate over the selected points
            foreach (var point in pointList)
            {
                pointMarker.Draw(e.RenderContext, xCalc.GetCoordinate(point.XValue), yCalc.GetCoordinate(point.YValue), stroke, fill);                                                      
            }
        }                    
    }
}

Here we’re using the Pointmarker.Draw method directly. This should render the series pointmarker but with an overridden colour at each point. Where the RenderSeries.PointMarker is null, we use the default (ellipse)

Let me know if this solves the problem!

Best regards,
Andrew

Images
  • You must to post comments
Showing 1 result
Your Answer

Please first to submit.

Try SciChart Today

Start a trial and discover why we are the choice
of demanding developers worldwide

Start TrialCase Studies