SwiftUI Charts中BarMark数据点注释重复双值：是Apple问题还是代码问题？

这是代码实现的问题，并非Apple的Bug。

问题原因 #

你给单个BarMark添加了两个annotation，但Swift Charts的注释系统在处理覆盖式注释时，若仅依赖.leading和.trailing的对齐方式，当Bar的宽度较小时，布局逻辑可能触发重复渲染，导致注释重复显示且数值异常。

修复方案 #

将注释精确绑定到最低温、最高温对应的X轴数值位置，而非依赖Bar的边缘对齐。这样能确保每个注释只渲染一次，且位置精准。

修改后的完整代码：

struct TenDayForecastViewChart: View {
    let dayWeatherList: [DayWeather]
    
    var body: some View {
        VStack(alignment: .leading) {
            Text("10-DAY FORECAST")
                .font(.caption)
                .opacity(0.5)
                .padding()
            
            Chart{
                ForEach(dayWeatherList, id: \.date) { dailyWeather in
                    // 提前计算转换后的温度值，减少重复代码
                    let lowTempF = dailyWeather.lowTemperature.converted(to: .fahrenheit).value
                    let highTempF = dailyWeather.highTemperature.converted(to: .fahrenheit).value
                    
                    BarMark(xStart: .value("Temperature", lowTempF),
                            xEnd: .value("Temperature", highTempF),
                            y: .value("Day", dailyWeather.date.formatAsAbbreviatedDay())
                    )
                    .foregroundStyle(Color.black)
                    
                    // 最低温注释：绑定到对应X轴数值位置
                    .annotation(position: .overlay, x: .value("Low Temp", lowTempF), alignment: .center) {
                        Text("\(lowTempF, format: .number.precision(.fractionLength(0)))")
                            .foregroundColor(.white)
                    }
                    
                    // 最高温注释：绑定到对应X轴数值位置
                    .annotation(position: .overlay, x: .value("High Temp", highTempF), alignment: .center) {
                        Text("\(highTempF, format: .number.precision(.fractionLength(0)))")
                            .foregroundColor(.blue)
                    }
                }
            }
            .chartXAxis(.hidden)
            .frame(height: 250)
            .padding(.horizontal)
        }
    }
}

补充说明 #

• 提前计算lowTempF和highTempF不仅减少了重复的类型转换操作，也让代码更易读。
• 通过x: .value(...)明确指定注释的X轴位置，彻底避免了因Bar布局范围导致的重复渲染问题。

内容的提问来源于stack exchange，提问作者Nat Serrano