Demonstrates how to enable Series Selection on tap in SciChart iOS Charts.

In this example we enable series selection using the SCISeriesSelectionModifier, a SCIChartModifierBase derived type attached to the SCIChartSurface.chartModifiers property.

The style of a series when selected is controlled by the RenderableSeries selectedStyle property.

// SeriesSelectionView.m

//******************************************************************************
// SCICHART® Copyright SciChart Ltd. 2011-2019. All rights reserved.
//
// Web: http://www.scichart.com
// Support: support@scichart.com
// Sales:   sales@scichart.com
//
// SeriesSelectionView.m is part of the SCICHART® Examples. Permission is hereby granted
// to modify, create derivative works, distribute and publish any part of this source
// code whether for commercial, private or personal use.
//
// The SCICHART® examples are distributed in the hope that they will be useful, but
// without any warranty. It is provided "AS IS" without warranty of any kind, either
// expressed or implied.
//******************************************************************************

#import "SeriesSelectionView.h"
#import "SCDDataManager.h"
#import <SciChart/SCIStyleBase+Protected.h>

#pragma mark - Selected Series Style

NSString * const Stroke = @"Stroke";
NSString * const PointMarker = @"PointMarker";

@interface SelectedSeriesStyle : SCIStyleBase<id<ISCIRenderableSeries>>
@end
@implementation SelectedSeriesStyle {
    SCISolidPenStyle *_selectedStrokeStyle;
    id<ISCIPointMarker> _selectedPointMarker;
}

- (instancetype)init {
    self = [super initWithStyleableType:SCIRenderableSeriesBase.class];
    if (self) {
        _selectedPointMarker = [SCIEllipsePointMarker new];
        _selectedPointMarker.size = CGSizeMake(10, 10);
        _selectedPointMarker.fillStyle = [[SCISolidBrushStyle alloc] initWithColorCode:0xFFFF00DC];
        _selectedPointMarker.strokeStyle = [[SCISolidPenStyle alloc] initWithColor:SCIColor.whiteColor thickness:1];
        
        _selectedStrokeStyle = [[SCISolidPenStyle alloc] initWithColor:SCIColor.whiteColor thickness:4];
    }
    return self;
}

- (void)applyStyleInternalTo:(id<ISCIRenderableSeries>)styleableObject {
    [self putProperty:Stroke value:styleableObject.strokeStyle intoObject:styleableObject];
    [self putProperty:PointMarker value:styleableObject.pointMarker intoObject:styleableObject];
    
    styleableObject.strokeStyle = _selectedStrokeStyle;
    styleableObject.pointMarker = _selectedPointMarker;
}

- (void)discardStyleInternalFrom:(id<ISCIRenderableSeries>)styleableObject {
    SCIPenStyle *penStyle = [self getValueFromProperty:Stroke ofType:SCISolidPenStyle.class fromObject:styleableObject];
    id<ISCIPointMarker> pointMarker = [self getValueFromProperty:PointMarker ofType:SCIEllipsePointMarker.class fromObject:styleableObject];
    
    styleableObject.strokeStyle = penStyle;
    styleableObject.pointMarker = pointMarker;
}

@end

#pragma mark - Chart Initialization

static double const SeriesPointCount = 50;
static int const SeriesCount = 80;

@implementation SeriesSelectionView

- (Class)associatedType { return SCIChartSurface.class; }

- (BOOL)showDefaultModifiersInToolbar { return NO; }

- (void)initExample {
    id<ISCIAxis> xAxis = [SCINumericAxis new];
    xAxis.autoRange = SCIAutoRange_Always;
    
    id<ISCIAxis> leftAxis = [SCINumericAxis new];
    leftAxis.axisId = @"yLeftAxis";
    leftAxis.axisAlignment = SCIAxisAlignment_Left;
    
    id<ISCIAxis> rightAxis = [SCINumericAxis new];
    rightAxis.axisId = @"yRightAxis";
    rightAxis.axisAlignment = SCIAxisAlignment_Right;
    
    SCISeriesSelectionModifier *seriesSelectionModifier = [SCISeriesSelectionModifier new];
    seriesSelectionModifier.selectedSeriesStyle = [SelectedSeriesStyle new];
    
    [SCIUpdateSuspender usingWithSuspendable:self.surface withBlock:^{
        [self.surface.xAxes add:xAxis];
        [self.surface.yAxes add:leftAxis];
        [self.surface.yAxes add:rightAxis];
        [self.surface.chartModifiers add:seriesSelectionModifier];
    
        SCIColor * initialColor = SCIColor.blueColor;
        for (int i = 0; i < SeriesCount; i++) {
            SCIAxisAlignment axisAlignment = i % 2 == 0 ? SCIAxisAlignment_Left : SCIAxisAlignment_Right;
            
            SCIFastLineRenderableSeries *rSeries = [SCIFastLineRenderableSeries new];
            rSeries.dataSeries = [self generateDataSeries:axisAlignment andIndex:i];
            rSeries.yAxisId = axisAlignment == SCIAxisAlignment_Left ? @"yLeftAxis" : @"yRightAxis";
            rSeries.strokeStyle = [[SCISolidPenStyle alloc] initWithColor:initialColor thickness:1.0];
            
            [self.surface.renderableSeries add:rSeries];
            
            CGFloat red, green, blue, alpha;
            [initialColor getRed:&red green:&green blue:&blue alpha:&alpha];
            
            CGFloat newR = red == 1.0 ? 1.0 : red + 0.0125;
            CGFloat newB = blue == 0.0 ? 0.0 : blue - 0.0125;
            initialColor = [SCIColor colorWithRed:newR green:green blue:newB alpha:alpha];
            
            [SCIAnimations sweepSeries:rSeries duration:3.0 andEasingFunction:[SCICubicEase new]];
        }
    }];
}

- (SCIXyDataSeries *)generateDataSeries:(SCIAxisAlignment)axisAlignment andIndex:(int)index {
    SCIXyDataSeries * dataSeries = [[SCIXyDataSeries alloc] initWithXType:SCIDataType_Double yType:SCIDataType_Double];
    dataSeries.seriesName = [[NSString alloc] initWithFormat:@"Series %i", index];
    
    double gradient = axisAlignment == SCIAxisAlignment_Right ? index: -index;
    double start = axisAlignment == SCIAxisAlignment_Right ? 0.0 : 14000;
 
    SCDDoubleSeries *straightLine = [SCDDataManager getStraightLinesWithGradient:gradient yIntercept:start pointCount:SeriesPointCount];
    [dataSeries appendValuesX:straightLine.xValues y:straightLine.yValues];
    
    return dataSeries;
}

@end

// SeriesSelectionView.swift

//******************************************************************************
// SCICHART® Copyright SciChart Ltd. 2011-2019. All rights reserved.
//
// Web: http://www.scichart.com
// Support: support@scichart.com
// Sales:   sales@scichart.com
//
// SeriesSelectionView.swift is part of the SCICHART® Examples. Permission is hereby granted
// to modify, create derivative works, distribute and publish any part of this source
// code whether for commercial, private or personal use.
//
// The SCICHART® examples are distributed in the hope that they will be useful, but
// without any warranty. It is provided "AS IS" without warranty of any kind, either
// expressed or implied.
//******************************************************************************

import SciChart.Protected.SCIStyleBase

class SelectedSeriesStyle: SCIStyleBase<ISCIRenderableSeries> {

    let Stroke = "Stroke"
    let selectedStrokeStyle = SCISolidPenStyle(color: .white, thickness: 4)
    let PointMarker = "PointMarker"
    let selectedPointMarker: ISCIPointMarker
    
    init() {
        selectedPointMarker = SCIEllipsePointMarker()
        selectedPointMarker.size = CGSize(width: 10, height: 10)
        selectedPointMarker.fillStyle = SCISolidBrushStyle(colorCode: 0xFFFF00DC)
        selectedPointMarker.strokeStyle = SCISolidPenStyle(color: .white, thickness: 1)
        
        super.init(styleableType: SCIRenderableSeriesBase.self)
    }
    
    override func applyStyleInternal(to styleableObject: ISCIRenderableSeries) {
        putProperty(Stroke, value: styleableObject.strokeStyle, intoObject: styleableObject)
        if let pointMarker = styleableObject.pointMarker {
            putProperty(PointMarker, value: pointMarker, intoObject: styleableObject)
        }
        
        styleableObject.strokeStyle = selectedStrokeStyle
        styleableObject.pointMarker = selectedPointMarker
    }
    
    override func discardStyleInternal(from styleableObject: ISCIRenderableSeries) {
        if let penStyle = getValueFromProperty(Stroke, ofType: SCISolidPenStyle.self, fromObject: styleableObject) as? SCIPenStyle {
            styleableObject.strokeStyle = penStyle
        }
        if let pointMarker = getValueFromProperty(PointMarker, ofType: ISCIPointMarker.self, fromObject: styleableObject) as? ISCIPointMarker {
            styleableObject.pointMarker = pointMarker
        }
    }
}

class SeriesSelectionView: SCDSingleChartViewController<SCIChartSurface> {
    
    let SeriesPointCount = 50
    let SeriesCount = 80
    
    override var associatedType: AnyClass { return SCIChartSurface.self }
    
    override var showDefaultModifiersInToolbar: Bool { return false }

    override func initExample() {
        let xAxis = SCINumericAxis()
        xAxis.autoRange = .always
        
        let leftAxis = SCINumericAxis()
        leftAxis.axisId = "yLeftAxis"
        leftAxis.axisAlignment = .left
        
        let rightAxis = SCINumericAxis()
        rightAxis.axisId = "yRightAxis"
        rightAxis.axisAlignment = .right
    
        let seriesSelectionModifier = SCISeriesSelectionModifier()
        seriesSelectionModifier.selectedSeriesStyle = SelectedSeriesStyle()
        
        SCIUpdateSuspender.usingWith(surface) {
            self.surface.xAxes.add(xAxis)
            self.surface.yAxes.add(items: leftAxis, rightAxis)
            self.surface.chartModifiers.add(seriesSelectionModifier)
            
            var initialColor = SCIColor.blue
            for i in 0 ..< self.SeriesCount {
                let axisAlignment: SCIAxisAlignment = i % 2 == 0 ? .left: .right;
                
                let rSeries = SCIFastLineRenderableSeries()
                rSeries.dataSeries = self.generateDataSeriesWith(axisAlignment, index: i)
                rSeries.yAxisId = axisAlignment == .left ? "yLeftAxis" : "yRightAxis"
                rSeries.strokeStyle = SCISolidPenStyle(color: initialColor, thickness: 1)
                
                self.surface.renderableSeries.add(rSeries)
                
                var red: CGFloat = 0, green: CGFloat = 0, blue: CGFloat = 0, alpha: CGFloat = 0
                initialColor.getRed(&red, green: &green, blue: &blue, alpha: &alpha)
                
                let newR = red == 1.0 ? 1.0 : red + 0.0125;
                let newB = blue == 0.0 ? 0.0 : blue - 0.0125;
                initialColor = SCIColor.init(red: newR, green: green, blue: newB, alpha: alpha)
                
                SCIAnimations.sweep(rSeries, duration: 3.0, easingFunction: SCICubicEase())
            }
        }
    }

    fileprivate func generateDataSeriesWith(_ axisAlignment: SCIAxisAlignment, index: Int) -> SCIXyDataSeries {
        let dataSeries = SCIXyDataSeries.init(xType: .double, yType: .double)
        dataSeries.seriesName = String(format: "Series %i", index)
        
        let gradient = Double(axisAlignment == .right ? index: -index);
        let start = axisAlignment == .right ? 0.0 : 14000;
        
        let straightLine = SCDDataManager.getStraightLines(withGradient: gradient, yIntercept: start, pointCount: SeriesPointCount)
        dataSeries.append(x: straightLine.xValues, y: straightLine.yValues)
        
        return dataSeries
    }
}

< BACK TO ALL IOS & MACOS CHARTS CHART EXAMPLES