代码之家 › 专栏 › 技术社区 › user20325868

我正在尝试理解swiftUI图表API,特别是覆盖图表并修改图表的某些方面

charts swiftui

user20325868 · 技术社区 · 6 月前

我刚开始在swiftui中使用Charts,我很挣扎。我想用折线图覆盖下图中的条形图。但我唯一能弄清楚的方法是嵌入ZStack,但如屏幕截图所示,两个图表(目前传递的数据相同)不对齐。我想展示一条覆盖条形图的平均线,但我就是想不出来。我对图表不太了解,我也是API的新手。我还想在酒吧或酒吧上方或其他地方显示实际金额。尚不确定在swiftui中是否可以实现这些功能。如果没有别的,你能给我指一些关于图表的好文件或其他信息吗?谢谢

这是我的代码的简化

        ZStack {
        Chart {
            ForEach(payments, id: \.date) { payment in

                BarMark(
                    x: .value("Date", payment.date),
                    y: .value("Amount", payment.amount)
                )
            }
        }

        Chart {

            ForEach(payments, id: \.date) { payment in
                LineMark(
                    x: .value("Date", payment.date),
                    y: .value("Amount", payment.amount)
                )
            }
        }
    }

1 回复 | 直到 6 月前

workingdog support Ukraine 6 月前

在以下情况下尝试这种方法你用一个 Chart 有两个 ForEach 例如:

 Chart {
     ForEach(payments, id: \.date) { payment in
         BarMark(
             x: .value("Date", payment.date, unit: .day), // <-- adjust as required
             y: .value("Amount", payment.amount)
         )
     }

     ForEach(payments, id: \.0) { payment in
         LineMark(
             x: .value("Date", payment.date, unit: .day), // <-- adjust as required
             y: .value("Amount", payment.amount)
         )
     }
 }

这是我的完整测试代码,显示了如何 BarMark 在一起与 LineMark 在顶部。

struct ChartData: Identifiable {
    let id = UUID()
    let value: Double
    let date: Date
}

struct ContentView: View {
    
    let chartData: [ChartData] = (0..<10).map { index in
        ChartData(value: Double.random(in: 1...10) ,
                  date: Date().addingTimeInterval(Double(index) * 60 * 60 * 24) )
    }

    var body: some View {
        Chart {
            ForEach(chartData) { data in
                BarMark(
                    x: .value("Date", data.date, unit: .day),
                    y: .value("Value", data.value)
                )
                .foregroundStyle(Color.blue)
            }
            ForEach(chartData) { data in
                LineMark(
                    x: .value("Date", data.date, unit: .day),
                    y: .value("Value", data.value)
                )
                .foregroundStyle(Color.red)
            }
        }
        .chartLegend(.hidden)
        .chartXAxis(.hidden)
        .chartYAxis(.hidden)
    }
}

推荐文章

Tulon · Firebase身份验证SwiftUI:更改密码后,电子邮件验证状态变为真

5 月前

Tom · SwiftUI.sheet导致背景白色闪烁

5 月前

cesarcarlos · tvOS的SwiftUI按钮中的导航禁用动画

5 月前

Z S · SwiftUI:使用@FocusState。与视图初始化器绑定

5 月前

HeWhoRemains · 如何在SwiftUI中创建圆形文本,根据度数变化从一条直线变为一个完美的圆?

5 月前

Dan Eden · 有没有办法在MapKit中更改卫星图像的时间?

5 月前

Ameen Izhac · 如何修复Swift Screen Time API错误:类型为“Button<Text>”的值没有成员“familyActivityPicker”

5 月前

Robin · LazyVGrid项目预计不会击中测试区域

5 月前

Mahendra · Popover不是从SwiftUI中的项目列表中打开的[重复]

5 月前

Moses Harding · 在SwiftUI的ForEach中以绑定和非绑定方式使用数组的单个成员,而不使用索引

6 月前