foregroundStyle(by: does not maintain consistent colour with limited series

When using foregroundStyle(by: and symbol(by: with a series of data using Multi-series Line Mark and limited with a pickerView, the colour/symbol changes depending on the number of series selected and is not consistent.

enum Hand {
    case left, right, both
}

struct HandSample: Identifiable {
    var hand: String    // Series
    var count: Double
    var date: Date
    var id = UUID()
}
    var data: [HandSample] {
        switch hand {
        case .both:
            return loadData(samples: samples, days: days, left: true, right: true)
        case .left:
            return loadData(samples: samples, days: days, left: true, right: false)
        case .right:
            return loadData(samples: samples, days: days, left: false, right: true)
        }
    }

    func loadData(samples: FetchedResults<Sample>, days: Int, left: Bool, right: Bool) -> [HandSample] {
        var series: Array<HandSample> = Array()
        let sinceDate = Calendar.current.date(byAdding: .day, value: -days, to: Date())
        for sample in samples {
            if sample.sampleDate > sinceDate! {
                if left {
                    let leftSamples = HandSample(hand: "Left", count: sample.left.doubleValue, date: sample.sampleDate)
                    series.append(leftSamples)
                }
                if right {
                    let rightSamples = HandSample(hand: "Right", count: sample.right.doubleValue, date: sample.sampleDate)
                    series.append(rightSamples)
                }
            }
        }
        return series
    }

    var body: some View {
        VStack {
            Picker ("Hand", selection: $hand.animation(.easeOut)) {
                Text("Both Hands")
                    .tag(Hand.both)
                Text("Left Hand")
                    .tag(Hand.left)
                Text("Right Hand")
                    .tag(Hand.right)
            }
            .pickerStyle(.segmented)
            Chart (data) {
                LineMark(
                    x: .value("Date", $0.date),
                    y: .value("Count", $0.count),
                    series: .value("Hand", $0.hand)
                )
                .foregroundStyle(by: $0.hand)
                PointMark(
                    x: .value("Date", $0.date),
                    y: .value("Count", $0.count)
                )
                .foregroundStyle(by: $0.hand)
                .symbol(by: .value("Hand", $0.hand))
            }
        }
    }

In the attached sample, shows Right as a Green Cross when Both Hands series are shown, but shows Right as a Blue Circle when only the Right Hand series is shown.

iOS 16 Beta 4 (20A5328h)

Xcode 14.0 beta 4 (14A5284g)

Answered by smudge.io in 723636022

The issue still occurs with iOS 16 Beta 5 (20A5339d) and Xcode 14.0 beta 5 (14A5294e).

Accepted Answer

The issue still occurs with iOS 16 Beta 5 (20A5339d) and Xcode 14.0 beta 5 (14A5294e).

Unresolved, but can't unmark it. Issue still occurs with iOS 16 Beta 6 (20A5349b).

The issue still occurs with iOS 16 Beta 7 (20A5356a) and Xcode 14.0 beta 6 (14A5294g). Unresolved, but can't unmark it.

FB11398532 with sample project.

Problem remains on iOS 16.0 Beta 8 (20A5358a).

The resolution is to specify the colours and symbols explicitly:

.chartForegroundStyleScale(["Left" : .blue, "Right" : .green])
.chartSymbolScale(["Left" : .circle, "Right" : .cross])

foregroundStyle(by: does not maintain consistent colour with limited series
 
 
Q