I'm trying to visualize some data using AreaMark of Swift Charts, however, different data structures seem to affect the result. Really confused here. The following two example structs hold the same data, but in different ways: import SwiftUI import Charts struct Food: Identifiable { let name: String let sales: Int let day: Int let id = UUID() init(name: String, sales: Int, day: Int) { self.name = name self.sales = sales self.day = day } } struct Sales: Identifiable { let day: Int let burger: Int let salad: Int let steak: Int let id = UUID() var total: Int { burger + salad + steak } init(day: Int, burger: Int, salad: Int, steak: Int) { self.day = day self.burger = burger self.salad = salad self.steak = steak } } Now if I populate data and use Swift Charts to plot the data, the first struct works perfectly with all types of charts. However, the second struct, while works well with BarMark and PointMark, doesn't seem to work with AreaMark. To reproduce, change "AreaMark" to "BarMark" or "PointMark" in the following code: struct ExperimentView: View { let cheeseburgerSalesByItem: [Food] = [ .init(name: "Burger", sales: 29, day: 1), .init(name: "Salad", sales: 35, day: 1), .init(name: "Steak", sales: 30, day: 1), .init(name: "Burger", sales: 32, day: 2), .init(name: "Salad", sales: 38, day: 2), .init(name: "Steak", sales: 42, day: 2), .init(name: "Burger", sales: 35, day: 3), .init(name: "Salad", sales: 29, day: 3), .init(name: "Steak", sales: 41, day: 3), .init(name: "Burger", sales: 29, day: 4), .init(name: "Salad", sales: 38, day: 4), .init(name: "Steak", sales: 39, day: 4), .init(name: "Burger", sales: 43, day: 5), .init(name: "Salad", sales: 42, day: 5), .init(name: "Steak", sales: 30, day: 5), .init(name: "Burger", sales: 45, day: 6), .init(name: "Salad", sales: 39, day: 6), .init(name: "Steak", sales: 31, day: 6), .init(name: "Burger", sales: 37, day: 7), .init(name: "Salad", sales: 35, day: 7), .init(name: "Steak", sales: 30, day: 7), ] let cheeseburgerSalesByDay: [Sales] = [ .init(day: 1, burger: 29, salad: 35, steak: 30), .init(day: 2, burger: 32, salad: 38, steak: 42), .init(day: 3, burger: 35, salad: 29, steak: 41), .init(day: 4, burger: 29, salad: 38, steak: 39), .init(day: 5, burger: 43, salad: 42, steak: 30), .init(day: 6, burger: 45, salad: 39, steak: 31), .init(day: 7, burger: 37, salad: 35, steak: 30) ] var body: some View { VStack { Chart(cheeseburgerSalesByItem) { sale in AreaMark( x: .value("Day", sale.day), y: .value("Sales", sale.sales) ) .foregroundStyle(by: .value("Food Item", sale.name)) } .chartXScale(domain: 1...7) .padding() Spacer() Chart(cheeseburgerSalesByDay) { sale in AreaMark( x: .value("Day", sale.day), y: .value("Burger", sale.burger) ) .foregroundStyle(.brown) AreaMark( x: .value("Day", sale.day), y: .value("Salad", sale.salad) ) .foregroundStyle(.green) AreaMark( x: .value("Day", sale.day), y: .value("Steak", sale.steak) ) .foregroundStyle(.red) } .padding() } } } If two of the three AreaMarks are commented out, the left one would work. Just more than one AreaMark plots don't work for this struct. So what is the problem here? What to do if I want to use the second structure and plot a AreaMark chart?