BIKCharts

1.0.1

SwiftUI Configurable Chart Library
ilyadaberdil/BIKCharts

What's New

2021-05-15T23:46:25Z

BIKCharts

BIKCharts is a new chart framework for iOS +13. There are different types of Charts like BarChart, LineChart, PieChart. There are lots of configurable options for these charts. All chart models are ObservableObject and these properties have publisher. So you can easily change your model dynamically.

  • Pure SwiftUI
  • Dynamic
  • Animatable
  • Tooltip support
  • Configurable
  • Easy to implement and use

Requirement

  • iOS +13

Implementation

Use Swift Package Manager and add package dependency
https://github.com/ilyadaberdil/BIKCharts.git

Usage

BarCharts

Create BarChartModel to configure your charts.
(Some of these properties have default value but you can configure as you wish)

// 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)

That's all 🎉
If you want to implement your custom dragAction, you can use this callBack;

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

LineChart

Create LineChartModel to configure your charts.
(Some of these properties have default value but you can configure as you wish)

// 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))

That's all 🎉
If you want to implement your custom dragAction, you can use this callBack;

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

PieChart

Create PieChartModel to configure your charts.
(Some of these properties have default value but you can configure as you wish)

// 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))

That's all 🎉
If you want to implement your custom tapAction, you can use this callBack;

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

Description

  • Swift Tools 5.3.0
View More Packages from this Author

Dependencies

  • None
Last updated: Wed Mar 20 2024 17:35:28 GMT-0900 (Hawaii-Aleutian Daylight Time)