SwiftUI Charts实现分段彩色LineMark问题：仅生效最后一个样式与颜色

你遇到的问题是因为SwiftUI Charts默认会让叠加的LineMark共享样式配置，导致只有最后一个的样式生效。下面给你两种可行的实现方案：

方案1：给数据添加分段标识，通过条件设置样式 #

先定义带分段标记的数据模型，用一个字段区分不同分段：

struct HealthData: Identifiable {
    let id = UUID()
    let value: Double
    let date: Date
    let isHighlighted: Bool // 用这个字段标记需要变色的分段
}

在Chart中，通过数据的分段标记动态设置样式：

Chart(yourHealthData) { data in
    LineMark(
        x: .value("日期", data.date),
        y: .value("数值", data.value)
    )
    // 按条件设置颜色
    .foregroundStyle(data.isHighlighted ? .systemRed : .systemGreen)
    // 按条件设置线条样式（比如虚线/实线）
    .lineStyle(StrokeStyle(
        lineWidth: 2,
        dash: data.isHighlighted ? [4, 2] : []
    ))
}

这种方式会让折线根据数据的分段标识自动切换样式，无需拆分数据。

方案2：拆分数据为多个区间，分别创建LineMark #

如果你的分段是固定区间（比如某日期之后的部分），可以把数据拆分成多个子数组，分别对应不同样式：

// 拆分数据为两个区间
let normalData = yourHealthData.filter { $0.date < thresholdDate }
let highlightedData = yourHealthData.filter { $0.date >= thresholdDate }

Chart {
    // 第一段折线：正常样式
    LineMark(
        x: .value("日期", \.date),
        y: .value("数值", \.value)
    )
    .foregroundStyle(.systemGreen)
    .lineStyle(StrokeStyle(lineWidth: 2))
    .data(normalData)
    
    // 第二段折线：高亮样式
    LineMark(
        x: .value("日期", \.date),
        y: .value("数值", \.value)
    )
    .foregroundStyle(.systemRed)
    .lineStyle(StrokeStyle(lineWidth: 2, dash: [4, 2]))
    .data(highlightedData)
}

注意：如果拆分后的区间数据不连续，折线会出现断点。需要保留交界处的数据点（比如把阈值日期的数据同时放到两个数组里），就能实现无缝连接。

核心提示 #

• 不要在同一个Chart里叠加LineMark却不指定data，否则后添加的样式会覆盖所有折线
• 方案1更适合动态分段（比如根据数值大小判断），方案2适合固定时间/数值区间的分段

内容的提问来源于stack exchange，提问作者Ahmad N.