如何在SwiftUI中实现图表？

Question

如何在SwiftUI中实现图表？

chartsswiftui

6

我如何在SwiftUI中使用Charts库创建图表视图？

换句话说，如何为其创建UIViewRepresentable？

- Mehdi

请尽量具体一些。你尝试过什么？能否展示一些代码以重现你所面临的问题？ - user7014451

假设你想在SwiftUI中使用[填写库名称]，那么什么是SwiftUI呢？它是一种管理视图的方式。无论是Pods、Swift Packages还是复制/粘贴，都是Swift而不是SwiftUI。你能在UIKit中实现这个吗？如果可以，那么你就可以将其作为UIViewRepresentable在SwiftUI中实现。但首先，在UIKit中让它正常工作。然后尝试将其转换为UIViewRepresentable或UIViewControllableRepresentable。我并不是要表现得苛刻，而是想指引你一个方向。继续... - user7014451

好的，假设你已经掌握了 SwiftUI 的基础知识。创建一个 UIView 或 UIViewController，并将其“可表示化”。现在你是否遇到了模型方面的问题？（相信我，这对我来说是一次范式转变。）如果有问题，请展示一些代码，最好能让任何人都能够重现。将你的模型（它是一个 ObservableObject 吗？）与你的 UIKit 库（它有委托吗？你需要创建一个协调器吗？）联系起来可能是最困难的挑战。但首先呢？如果它是一个 UIViewRepresentable，请先在一个 UIKit 项目中使其正常工作。 - user7014451

纯SwiftUI？我猜还不是（至少目前还不是）。这是我所知道的最好的：https://stackoverflow.com/questions/57100110/in-swiftui-how-do-i-create-a-dynamic-rectangle-for-a-bar-chart 但由于它是一个条形图而不是饼图，也许这个可以帮到你？https://talk.objc.io/episodes/S01E164-paths-and-shapes 如果可能的话，我可能会选择使用UIKit路线和可表示性。 - user7014451

@dfd 不是纯粹的SwiftUI，我指的是使用SwiftUI的Text和Steppers（以及可能的绑定），再加上一个用于表示ChartView的视图（符合UIViewRepresentable协议）。 - Mehdi

显示剩余2条评论

2个回答

0

如果您想在数据更改时更新图形视图，请添加一个UpdateData()函数，其中设置并返回您的LineChartData()对象。

然后设置uiView.data = UpdateData()并调用uiView.notifyDataSetChanged()。这应该重新渲染您的图形。

- Leigh Yeh

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Nas5296 · Accepted Answer

以下是一些样例代码，应该可以帮助您入门。不确定这是否是最佳实践，但这是使用Charts和SwiftUI让我开始的最简单的方法。希望这可以帮到您！

import SwiftUI
import Charts

struct GraphSwiftUI: View {
    var body: some View {
        GeometryReader { p in
            VStack {
                LineChartSwiftUI()
                    //use frame to change the graph size within your SwiftUI view
                    .frame(width: p.size.width, height: p.size.height/5, alignment: .center)
            }
        }
    }
}

struct LineChartSwiftUI: UIViewRepresentable {
    let lineChart = LineChartView()

    func makeUIView(context: UIViewRepresentableContext<LineChartSwiftUI>) -> LineChartView {
        setUpChart()
        return lineChart
    }

    func updateUIView(_ uiView: LineChartView, context: UIViewRepresentableContext<LineChartSwiftUI>) {

    }

    func setUpChart() {
        lineChart.noDataText = "No Data Available"
        let dataSets = [getLineChartDataSet()]
        let data = LineChartData(dataSets: dataSets)
        data.setValueFont(.systemFont(ofSize: 7, weight: .light))
        lineChart.data = data
    }

    func getChartDataPoints(sessions: [Int], accuracy: [Double]) -> [ChartDataEntry] {
        var dataPoints: [ChartDataEntry] = []
        for count in (0..<sessions.count) {
            dataPoints.append(ChartDataEntry.init(x: Double(sessions[count]), y: accuracy[count]))
        }
        return dataPoints
    }

    func getLineChartDataSet() -> LineChartDataSet {
        let dataPoints = getChartDataPoints(sessions: [0,1,2], accuracy: [100.0, 20.0, 30.0])
        let set = LineChartDataSet(entries: dataPoints, label: "DataSet")
        set.lineWidth = 2.5
        set.circleRadius = 4
        set.circleHoleRadius = 2
        let color = ChartColorTemplates.vordiplom()[0]
        set.setColor(color)
        set.setCircleColor(color)
        return set
    }
}

struct GraphSwiftUI_Previews: PreviewProvider {
    static var previews: some View {
        GraphSwiftUI()
    }
}