BIKCharts

BIKCharts 是一个全新的 iOS +13 图表框架。它包含不同类型的图表,如条形图 (BarChart)、折线图 (LineChart) 和饼图 (PieChart)。这些图表有许多可配置的选项。

提示:所有图表模型都是 ObservableObject,并且这些属性都具有发布者 (publisher)。因此,您可以轻松地动态更改您的模型。

要求

安装

使用 Swift Package Manager 并添加包依赖 (File > Swift Packages > Add Package Dependency...)
https://github.com/ilyadaberdil/BIKCharts.git

用法

条形图 (BarCharts)

创建 BarChartModel 来配置您的图表。
(其中一些属性具有默认值,但您可以根据需要进行配置)

// Sample titles and values for BarChartModel
let values: [CGFloat] = [300, 300, 400, 800, 1500, 400, 300, 800, 2000, 144, 53, 71]
let titles: [String] = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]

let model = BarChartModel(data: values,
                          dataDescriptions: titles,
                          calculationType: .maxValue,
                          barSpacing: 16,
                          fillBarColor: .green,
                          emptyBarColor: .gray,
                          barCornerRadius: .zero,
                          showValueText: false,
                          showValueDescription: true,
                          isBadgeViewEnabled: true,
                          badgeViewModel: BadgeValueModel(showUnderline: true, 
                                                          underlineColor: .red, 
                                                          title: "Value", 
                                                          foregroundColor: .purple),
                          direction: .vertical)

就这样 🎉
如果您想实现自定义的 dragAction,可以使用此回调;

BarChart(with: model, dragAction: { (value) in
  print(value)
})
.frame(width: 350, height: 250)
示例

折线图 (LineChart)

创建 LineChartModel 来配置您的图表。
(其中一些属性具有默认值,但您可以根据需要进行配置)

// Sample values for LineChartModel
let values: [CGFloat] = [300, 300, 400, 800, 1500, 400, 300, 800, 2000, 144, 53, 71]

let model = LineChartModel(data: values,
                           calculationStyle: .maxValue,
                           lineWidth: 2,
                           showPoints: true,
                           lineColor: .red,
                           pointColor: .gray,
                           fillWithLinearGradient: LinearGradient(gradient: Gradient(colors: [.red, .green, .purple]),
                                                                  startPoint: .bottom,
                                                                  endPoint: .top),
                           showLineWhenFilled: true,
                           dashOfLine: [10],
                           isBadgeViewEnabled: true,
                           badgeViewModel: BadgeValueModel(showUnderline: true,
                                                           underlineColor: .red,
                                                           title: "Value",
                                                           foregroundColor: .blue))

就这样 🎉
如果您想实现自定义的 dragAction,可以使用此回调;

LineChart(with: model, dragAction: { (value) in
  print(value)
})
.frame(height: 120)
示例

饼图 (PieChart)

创建 PieChartModel 来配置您的图表。
(其中一些属性具有默认值,但您可以根据需要进行配置)

// Sample pieChartDataList for PieChartModel
  let pieChartDataList: [PieChartData] = [.init(slice: .init(value: 35, color: .red),
                                                              titleConfiguration: .init(title: "C",
                                                                                        foregroundColor: .black,
                                                                                        font: .headline)),
                                                        .init(slice: .init(value: 75, color: .green),
                                                              titleConfiguration: .init(title: "C++",
                                                                                        foregroundColor: .yellow,
                                                                                        font: .headline)),
                                                        .init(slice: .init(value: 55, color: .gray),
                                                              titleConfiguration: .init(title: "Java",
                                                                                        foregroundColor: .blue,
                                                                                        font: .headline)),
                                                        .init(slice: .init(value: 124, color: .orange),
                                                              titleConfiguration: .init(title: "Kotlin",
                                                                                        foregroundColor: .gray,
                                                                                        font: .headline)),
                                                        .init(slice: .init(value: 172, color: .blue),
                                                              titleConfiguration: .init(title: "Swift",
                                                                                        foregroundColor: .orange,
                                                                                 font: .headline))]
                                                                                 
    let model = PieChartModel(data: pieChartDataList,
                                    borderStyle: BorderStyle(circumferenceBorderStrokeStyle: .init(lineWidth: 3,
                                                                                                   lineCap: .butt,
                                                                                                   lineJoin: .bevel,
                                                                                                   dash: [20]),
                                                             circumferenceBorderColor: .pink))

就这样 🎉
如果您想实现自定义的 tapAction,可以使用此回调;

PieChart(viewModel: model, tapAction: { (data) in
  print(data)
})
.frame(height: 250)
示例

作者

Berdil İlyada Karacam
ilyadaberdil@gmail.com
https://www.linkedin.com/in/ilyadaberdil

许可证

BIKCharts 在 MIT 许可证下可用。有关更多信息,请参见 LICENSE 文件。