fixed unwrap error

* Customisable drop shadow color

* Drop shadow color parameter in ChartStyle

* Fixed BarChartView

.swiftpm/xcode/xcuserdata/samuandris.xcuserdatad/xcschemes/xcschememanagement.plist

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>SchemeUserState</key>
+	<dict>
+		<key>SwiftUICharts.xcscheme_^#shared#^_</key>
+		<dict>
+			<key>orderHint</key>
+			<integer>1</integer>
+		</dict>
+	</dict>
+</dict>
+</plist>

Package.swift

@@ -6,7 +6,7 @@ import PackageDescription
 let package = Package(
     name: "SwiftUICharts",
     platforms: [
-        .iOS(.v13),
+        .iOS(.v13),.watchOS(.v6)
     ],
     products: [
         // Products define the executables and libraries produced by a package, and make them visible to other packages.

README.md

@@ -2,7 +2,7 @@
 
 Swift package for displaying charts effortlessly.
 
-![SwiftUI Charts](./showcase1.gif "SwiftUI Charts")
+![SwiftUI Charts](./Resources/showcase1.gif "SwiftUI Charts")
 
 It supports:
 * Line charts
@@ -11,9 +11,9 @@ It supports:
 
 ### Installation:
 
-It requires iOS 13 and xCode 11!
+It requires iOS 13 and Xcode 11!
 
-In xCode got to `File -> Swift Packages -> Add Package Dependency` and paste inthe repo's url: `https://github.com/AppPear/ChartView`
+In Xcode got to `File -> Swift Packages -> Add Package Dependency` and paste inthe repo's url: `https://github.com/AppPear/ChartView`
 
 ### Usage:
 
@@ -21,8 +21,52 @@ import the package in the file you would like to use it: `import SwiftUICharts`
 
 You can display a Chart by adding a chart view to your parent view: 
 
+### Demo
+
+Added an example project, with **iOS, watchOS** target: https://github.com/AppPear/ChartViewDemo
+
 ## Line charts
-![Line Charts](./showcase3.gif "Line Charts")
+
+**LineChartView with multiple lines!**
+First release of this feature, interaction is disabled for now, I'll figure it out how could be the best to interact with multiple lines with a single touch.
+![Multiine Charts](./Resources/multiline1.gif "Multiine Charts")
+
+Usage:
+```swift
+MultiLineChartView(data: [([8,32,11,23,40,28], GradientColors.green), ([90,99,78,111,70,60,77], GradientColors.purple), ([34,56,72,38,43,100,50], GradientColors.orngPink)], title: "Title")
+```
+Gradient colors are now under the `GradientColor` struct you can create your own gradient by `GradientColor(start: Color, end: Color)`
+
+Available preset gradients: 
+* orange 
+* blue
+* green
+* blu 
+* bluPurpl
+* purple
+* prplPink 
+* prplNeon
+* orngPink
+
+**Full screen view called LineView!!!**
+
+![Line Charts](./Resources/fullscreen2.gif "Line Charts")
+
+```swift
+ LineView(data: [8,23,54,32,12,37,7,23,43], title: "Line chart", legend: "Full screen") // legend is optional, use optional .padding()
+```
+
+Adopts to dark mode automatically 
+
+![Line Charts](./Resources/showcase3.gif "Line Charts")
+
+You can add your custom darkmode style by specifying:
+
+```swift
+let myCustomStyle = ChartStyle(...)
+let myCutsomDarkModeStyle = ChartStyle(...)
+myCustomStyle.darkModeStyle = myCutsomDarkModeStyle
+```
 
 **Line chart is interactive, so you can drag across to reveal the data points**
 
@@ -32,39 +76,72 @@ You can add a line chart with the following code:
  LineChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", legend: "Legendary") // legend is optional
 ```
 
+**Turn drop shadow off by adding to the Initialiser: `dropShadow: false`**
+
 
 ## Bar charts
-![Bar Charts](./showcase2.gif "Bar Charts")
+![Bar Charts](./Resources/showcase2.gif "Bar Charts")
 
+**[New feature] you can display labels also along values and points for each bar to descirbe your data better!**
 **Bar chart is interactive, so you can drag across to reveal the data points**
 
 You can add a bar chart with the following code: 
 
+Labels and points:
+
 ```swift
- BarChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", legend: "Legendary") // legend is optional
+ BarChartView(data: ChartData(values: [("2018 Q4",63150), ("2019 Q1",50900), ("2019 Q2",77550), ("2019 Q3",79600), ("2019 Q4",92550)]), title: "Sales", legend: "Quarterly") // legend is optional
+```
+Only points:
+
+```swift
+ BarChartView(data: ChartData(points: [8,23,54,32,12,37,7,23,43]), title: "Title", legend: "Legendary") // legend is optional
 ```
 
-You can add different formats: 
-* Small `Form.small`
-* Medium  `Form.medium`
-* Large `Form.large` 
+**ChartData** structure
+Stores values in data pairs (actually tuple): `(String,Double)`
+* you can have duplicate values
+* keeps the data order
+
+You can initialise ChartData multiple ways:
+* For integer values: `ChartData(points: [8,23,54,32,12,37,7,23,43])`
+* For floating point values: `ChartData(points: [2.34,3.14,4.56])`
+* For label,value pairs: `ChartData(values: [("2018 Q4",63150), ("2019 Q1",50900)])`
+
+
+You can add different formats: 
+* Small `ChartForm.small`
+* Medium  `ChartForm.medium`
+* Large `ChartForm.large` 
+
+```swift
+BarChartView(data: ChartData(points: [8,23,54,32,12,37,7,23,43]), title: "Title", form: ChartForm.small)
+```
+
+For floating point numbers, you can set a custom specifier: 
+
+```swift
+BarChartView(data: ChartData(points:[1.23,2.43,3.37]) ,title: "A", valueSpecifier: "%.2f")
+```
+For integers you can disable by passing: `valueSpecifier: "%.0f"`
+
+
+You can set your custom image in the upper right corner by passing in the initialiser: `cornerImage:Image(systemName: "waveform.path.ecg")` 
+
+
+ **Turn drop shadow off by adding to the Initialiser: `dropShadow: false`**
 
- ```swift
- BarChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", style: ChartStyle(formSize: Form.small))
- ```
- 
  ### You can customize styling of the chart with a ChartStyle object: 
 
 Customizable: 
 * background color
 * accent color
 * second gradient color
-* chart form size
 * text color
 * legend text color
 
 ```swift
- let chartStyle = ChartStyle(backgroundColor: Color.black, accentColor: Colors.OrangeStart, secondGradientColor: Colors.OrangeEnd, chartFormSize: Form.medium, textColor: Color.white, legendTextColor: Color.white )
+ let chartStyle = ChartStyle(backgroundColor: Color.black, accentColor: Colors.OrangeStart, secondGradientColor: Colors.OrangeEnd, chartFormSize: ChartForm.medium, textColor: Color.white, legendTextColor: Color.white )
  ...
  BarChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", style: chartStyle)
 ```
@@ -81,17 +158,35 @@ You can access built-in styles:
 * barChartMidnightGreenLight
 * barChartMidnightGreenDark
 
-![Midnightgreen](./midnightgreen.gif "Midnightgreen")
+![Midnightgreen](./Resources/midnightgreen.gif "Midnightgreen")
 
-![Custom Charts](./showcase5.png "Custom Charts")
+![Custom Charts](./Resources/showcase5.png "Custom Charts")
 
 
+### You can customize the size of the chart with a ChartForm object: 
+
+**ChartForm**
+* `.small`
+* `.medium`
+* `.large`
+* `.detail`
+
+```swift
+BarChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", form: ChartForm.small)
+```
+
+### WatchOS support for Bar charts: 
+
+![Pie Charts](./Resources/watchos1.png "Pie Charts")
+
 ## Pie charts
-![Pie Charts](./showcase4.png "Pie Charts")
+![Pie Charts](./Resources/showcase4.png "Pie Charts")
 
-You can add a line chart with the following code: 
+You can add a pie chart with the following code: 
 
 ```swift
  PieChartView(data: [8,23,54,32], title: "Title", legend: "Legendary") // legend is optional
 ```
 
+**Turn drop shadow off by adding to the Initialiser: `dropShadow: false`**
+

Sources/SwiftUICharts/BarChart/BarChartCell.swift

@@ -17,19 +17,14 @@ public struct BarChartCell : View {
         return Double(width)/(Double(numberOfDataPoints) * 1.5)
     }
     var accentColor: Color
-    var secondGradientAccentColor: Color?
-    var gradientColors:[Color] {
-        if (secondGradientAccentColor != nil) {
-            return [secondGradientAccentColor!, accentColor]
-        }
-        return [accentColor, accentColor]
-    }
+    var gradient: GradientColor?
+    
     @State var scaleValue: Double = 0
     @Binding var touchLocation: CGFloat
     public var body: some View {
         ZStack {
             RoundedRectangle(cornerRadius: 4)
-                .fill(LinearGradient(gradient: Gradient(colors: gradientColors), startPoint: .bottom, endPoint: .top))
+                .fill(LinearGradient(gradient: gradient?.getGradient() ?? GradientColor(start: accentColor, end: accentColor).getGradient(), startPoint: .bottom, endPoint: .top))
             }
             .frame(width: CGFloat(self.cellWidth))
             .scaleEffect(CGSize(width: 1, height: self.scaleValue), anchor: .bottom)
@@ -43,7 +38,7 @@ public struct BarChartCell : View {
 #if DEBUG
 struct ChartCell_Previews : PreviewProvider {
     static var previews: some View {
-        BarChartCell(value: Double(0.75), width: 320, numberOfDataPoints: 12, accentColor: Colors.OrangeStart, secondGradientAccentColor: nil, touchLocation: .constant(-1))
+        BarChartCell(value: Double(0.75), width: 320, numberOfDataPoints: 12, accentColor: Colors.OrangeStart, gradient: nil, touchLocation: .constant(-1))
     }
 }
 #endif

Sources/SwiftUICharts/BarChart/BarChartRow.swift

@@ -9,25 +9,36 @@
 import SwiftUI
 
 public struct BarChartRow : View {
-    var data: [Int]
+    var data: [Double]
     var accentColor: Color
-    var secondGradientAccentColor: Color?
-    var maxValue: Int {
+    var gradient: GradientColor?
+    var maxValue: Double {
         data.max() ?? 0
     }
     @Binding var touchLocation: CGFloat
     public var body: some View {
         GeometryReader { geometry in
             HStack(alignment: .bottom, spacing: (geometry.frame(in: .local).width-22)/CGFloat(self.data.count * 3)){
-                ForEach(0..<self.data.count) { i in
-                    BarChartCell(value: Double(self.data[i])/Double(self.maxValue), index: i, width: Float(geometry.frame(in: .local).width - 22), numberOfDataPoints: self.data.count, accentColor: self.accentColor, secondGradientAccentColor: self.secondGradientAccentColor, touchLocation: self.$touchLocation)
+                ForEach(0..<self.data.count, id: \.self) { i in
+                    BarChartCell(value: self.normalizedValue(index: i),
+                                 index: i,
+                                 width: Float(geometry.frame(in: .local).width - 22),
+                                 numberOfDataPoints: self.data.count,
+                                 accentColor: self.accentColor,
+                                 gradient: self.gradient,
+                                 touchLocation: self.$touchLocation)
                         .scaleEffect(self.touchLocation > CGFloat(i)/CGFloat(self.data.count) && self.touchLocation < CGFloat(i+1)/CGFloat(self.data.count) ? CGSize(width: 1.4, height: 1.1) : CGSize(width: 1, height: 1), anchor: .bottom)
+                        .animation(.spring())
                     
                 }
             }
             .padding([.top, .leading, .trailing], 10)
         }
     }
+    
+    func normalizedValue(index: Int) -> Double {
+        return Double(self.data[index])/Double(self.maxValue)
+    }
 }
 
 #if DEBUG

Sources/SwiftUICharts/BarChart/BarChartView.swift

@@ -9,78 +9,104 @@
 import SwiftUI
 
 public struct BarChartView : View {
-    public var data: [Int]
+    @Environment(\.colorScheme) var colorScheme: ColorScheme
+    private var data: ChartData
     public var title: String
     public var legend: String?
     public var style: ChartStyle
-    let selectionFeedbackGenerator = UISelectionFeedbackGenerator()
+    public var darkModeStyle: ChartStyle
+    public var formSize:CGSize
+    public var dropShadow: Bool
+    public var cornerImage: Image
+    public var valueSpecifier:String
     
     @State private var touchLocation: CGFloat = -1.0
     @State private var showValue: Bool = false
-    @State private var currentValue: Int = 0 {
+    @State private var showLabelValue: Bool = false
+    @State private var currentValue: Double = 0 {
         didSet{
             if(oldValue != self.currentValue && self.showValue) {
-                selectionFeedbackGenerator.selectionChanged()
+                HapticFeedback.playSelection()
             }
         }
     }
     var isFullWidth:Bool {
-        return self.style.chartFormSize == Form.large
+        return self.formSize == ChartForm.large
     }
-    public init(data: [Int], title: String, legend: String? = nil, style: ChartStyle = Styles.barChartStyleOne ){
+    public init(data:ChartData, title: String, legend: String? = nil, style: ChartStyle = Styles.barChartStyleOrangeLight, form: CGSize? = ChartForm.medium, dropShadow: Bool? = true, cornerImage:Image? = Image(systemName: "waveform.path.ecg"), valueSpecifier: String? = "%.1f"){
         self.data = data
         self.title = title
         self.legend = legend
         self.style = style
+        self.darkModeStyle = style.darkModeStyle != nil ? style.darkModeStyle! : Styles.barChartStyleOrangeDark
+        self.formSize = form!
+        self.dropShadow = dropShadow!
+        self.cornerImage = cornerImage!
+        self.valueSpecifier = valueSpecifier!
     }
     
     public var body: some View {
         ZStack{
             Rectangle()
-                .fill(self.style.backgroundColor)
+                .fill(self.colorScheme == .dark ? self.darkModeStyle.backgroundColor : self.style.backgroundColor)
                 .cornerRadius(20)
-                .shadow(color: Color.gray, radius: 8 )
+                .shadow(color: self.style.dropShadowColor, radius: self.dropShadow ? 8 : 0)
             VStack(alignment: .leading){
                 HStack{
                     if(!showValue){
                         Text(self.title)
                             .font(.headline)
-                            .foregroundColor(self.style.textColor)
+                            .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.textColor : self.style.textColor)
                     }else{
-                        Text("\(self.currentValue)")
+                        Text("\(self.currentValue, specifier: self.valueSpecifier)")
                             .font(.headline)
-                            .foregroundColor(self.style.textColor)
+                            .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.textColor : self.style.textColor)
                     }
-                    if(self.style.chartFormSize == Form.large && self.legend != nil && !showValue) {
+                    if(self.formSize == ChartForm.large && self.legend != nil && !showValue) {
                         Text(self.legend!)
                             .font(.callout)
-                            .foregroundColor(self.style.accentColor)
+                            .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.accentColor : self.style.accentColor)
                             .transition(.opacity)
                             .animation(.easeOut)
                     }
                     Spacer()
-                    Image(systemName: "waveform.path.ecg")
+                    self.cornerImage
                         .imageScale(.large)
-                        .foregroundColor(self.style.legendTextColor)
+                        .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.legendTextColor : self.style.legendTextColor)
                 }.padding()
-                BarChartRow(data: data, accentColor: self.style.accentColor, secondGradientAccentColor: self.style.secondGradientColor, touchLocation: self.$touchLocation)
-                if self.legend != nil  && self.style.chartFormSize == Form.medium {
+                BarChartRow(data: data.points.map{$0.1},
+                            accentColor: self.colorScheme == .dark ? self.darkModeStyle.accentColor : self.style.accentColor,
+                            gradient: self.colorScheme == .dark ? self.darkModeStyle.gradientColor : self.style.gradientColor,
+                            touchLocation: self.$touchLocation)
+                if self.legend != nil  && self.formSize == ChartForm.medium && !self.showLabelValue{
                     Text(self.legend!)
                         .font(.headline)
-                        .foregroundColor(self.style.legendTextColor)
+                        .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.legendTextColor : self.style.legendTextColor)
                         .padding()
+                }else if (self.data.valuesGiven && self.getCurrentValue() != nil) {
+                    LabelView(arrowOffset: self.getArrowOffset(touchLocation: self.touchLocation),
+                              title: .constant(self.getCurrentValue()!.0))
+                        .offset(x: self.getLabelViewOffset(touchLocation: self.touchLocation), y: -6)
+                        .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.legendTextColor : self.style.legendTextColor)
                 }
                 
             }
-        }.frame(minWidth:self.style.chartFormSize.width, maxWidth: self.isFullWidth ? .infinity : self.style.chartFormSize.width, minHeight:self.style.chartFormSize.height, maxHeight:self.style.chartFormSize.height)
+        }.frame(minWidth:self.formSize.width,
+                maxWidth: self.isFullWidth ? .infinity : self.formSize.width,
+                minHeight:self.formSize.height,
+                maxHeight:self.formSize.height)
             .gesture(DragGesture()
                 .onChanged({ value in
-                    self.touchLocation = value.location.x/self.style.chartFormSize.width
+                    self.touchLocation = value.location.x/self.formSize.width
                     self.showValue = true
-                    self.currentValue = self.getCurrentValue()
+                    self.currentValue = self.getCurrentValue()?.1 ?? 0
+                    if(self.data.valuesGiven && self.formSize == ChartForm.medium) {
+                        self.showLabelValue = true
+                    }
                 })
                 .onEnded({ value in
                     self.showValue = false
+                    self.showLabelValue = false
                     self.touchLocation = -1
                 })
         )
@@ -88,17 +114,35 @@ public struct BarChartView : View {
         )
     }
     
-    func getCurrentValue()-> Int{
-        let index = max(0,min(self.data.count-1,Int(floor((self.touchLocation*self.style.chartFormSize.width)/(self.style.chartFormSize.width/CGFloat(self.data.count))))))
-        print(index)
-        return self.data[index]
+    func getArrowOffset(touchLocation:CGFloat) -> Binding<CGFloat> {
+        let realLoc = (self.touchLocation * self.formSize.width) - 50
+        if realLoc < 10 {
+            return .constant(realLoc - 10)
+        }else if realLoc > self.formSize.width-110 {
+            return .constant((self.formSize.width-110 - realLoc) * -1)
+        } else {
+            return .constant(0)
+        }
+    }
+    
+    func getLabelViewOffset(touchLocation:CGFloat) -> CGFloat {
+        return min(self.formSize.width-110,max(10,(self.touchLocation * self.formSize.width) - 50))
+    }
+    
+    func getCurrentValue() -> (String,Double)? {
+        guard self.data.points.count > 0 else { return nil}
+        let index = max(0,min(self.data.points.count-1,Int(floor((self.touchLocation*self.formSize.width)/(self.formSize.width/CGFloat(self.data.points.count))))))
+        return self.data.points[index]
     }
 }
 
 #if DEBUG
 struct ChartView_Previews : PreviewProvider {
     static var previews: some View {
-        BarChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", legend: "Legendary")
+        BarChartView(data: TestData.values ,
+                     title: "Model 3 sales",
+                     legend: "Quarterly",
+                     valueSpecifier: "%.0f")
     }
 }
 #endif

Sources/SwiftUICharts/BarChart/LabelView.swift

@@ -0,0 +1,46 @@
+//
+//  LabelView.swift
+//  BarChart
+//
+//  Created by Samu András on 2020. 01. 08..
+//  Copyright © 2020. Samu András. All rights reserved.
+//
+
+import SwiftUI
+
+struct LabelView: View {
+    @Binding var arrowOffset: CGFloat
+    @Binding var title:String
+    var body: some View {
+        VStack{
+            ArrowUp().fill(Color.white).frame(width: 20, height: 12, alignment: .center).shadow(color: Color.gray, radius: 8, x: 0, y: 0).offset(x: getArrowOffset(offset:self.arrowOffset), y: 12)
+            ZStack{
+                RoundedRectangle(cornerRadius: 8).frame(width: 100, height: 32, alignment: .center).foregroundColor(Color.white).shadow(radius: 8)
+                Text(self.title).font(.caption).bold()
+                ArrowUp().fill(Color.white).frame(width: 20, height: 12, alignment: .center).zIndex(999).offset(x: getArrowOffset(offset:self.arrowOffset), y: -20)
+
+            }
+        }
+    }
+    
+    func getArrowOffset(offset: CGFloat) -> CGFloat {
+        return max(-36,min(36, offset))
+    }
+}
+
+struct ArrowUp: Shape {
+    func path(in rect: CGRect) -> Path {
+        var path = Path()
+        path.move(to: CGPoint(x: 0, y: rect.height))
+        path.addLine(to: CGPoint(x: rect.width/2, y: 0))
+        path.addLine(to: CGPoint(x: rect.width, y: rect.height))
+        path.closeSubpath()
+        return path
+    }
+}
+
+struct LabelView_Previews: PreviewProvider {
+    static var previews: some View {
+        LabelView(arrowOffset: .constant(0), title: .constant("Tesla model 3"))
+    }
+}

Sources/SwiftUICharts/Helpers.swift

@@ -1,6 +1,6 @@
 //
 //  File.swift
-//  
+//
 //
 //  Created by András Samu on 2019. 07. 19..
 //
@@ -15,10 +15,11 @@ public struct Colors {
     public static let color2Accent:Color = Color(hexString: "#4266E8")
     public static let color3:Color = Color(hexString: "#FCECEA")
     public static let color3Accent:Color = Color(hexString: "#E1614C")
-    public static let OrangeStart:Color = Color(hexString: "#FF782C")
-    public static let OrangeEnd:Color = Color(hexString: "#EC2301")
+    public static let OrangeEnd:Color = Color(hexString: "#FF782C")
+    public static let OrangeStart:Color = Color(hexString: "#EC2301")
     public static let LegendText:Color = Color(hexString: "#A7A6A8")
     public static let LegendColor:Color = Color(hexString: "#E8E7EA")
+    public static let LegendDarkColor:Color = Color(hexString: "#545454")
     public static let IndicatorKnob:Color = Color(hexString: "#FF57A6")
     public static let GradientUpperBlue:Color = Color(hexString: "#C2E8FF")
     public static let GradinetUpperBlue1:Color = Color(hexString: "#A8E1FF")
@@ -27,8 +28,32 @@ public struct Colors {
     public static let GradientLowerBlue:Color = Color(hexString: "#F1F9FF")
     public static let DarkPurple:Color = Color(hexString: "#1B205E")
     public static let BorderBlue:Color = Color(hexString: "#4EBCFF")
+}
+
+public struct GradientColor {
+    public let start: Color
+    public let end: Color
     
+    init(start: Color, end: Color) {
+        self.start = start
+        self.end = end
+    }
     
+    public func getGradient() -> Gradient {
+        return Gradient(colors: [start, end])
+    }
+}
+
+public struct GradientColors {
+    public static let orange = GradientColor(start: Colors.OrangeStart, end: Colors.OrangeEnd)
+    public static let blue = GradientColor(start: Colors.GradientPurple, end: Colors.GradientNeonBlue)
+    public static let green = GradientColor(start: Color(hexString: "0BCDF7"), end: Color(hexString: "A2FEAE"))
+    public static let blu = GradientColor(start: Color(hexString: "0591FF"), end: Color(hexString: "29D9FE"))
+    public static let bluPurpl = GradientColor(start: Color(hexString: "4ABBFB"), end: Color(hexString: "8C00FF"))
+    public static let purple = GradientColor(start: Color(hexString: "741DF4"), end: Color(hexString: "C501B0"))
+    public static let prplPink = GradientColor(start: Color(hexString: "BC05AF"), end: Color(hexString: "FF1378"))
+    public static let prplNeon = GradientColor(start: Color(hexString: "FE019A"), end: Color(hexString: "FE0BF4"))
+    public static let orngPink = GradientColor(start: Color(hexString: "FF8E2D"), end: Color(hexString: "FF4E7A"))
 }
 
 public struct Styles {
@@ -36,120 +61,193 @@ public struct Styles {
         backgroundColor: Color.white,
         accentColor: Colors.OrangeStart,
         secondGradientColor: Colors.OrangeEnd,
-        chartFormSize: Form.medium,
         textColor: Color.black,
-        legendTextColor: Color.gray)
+        legendTextColor: Color.gray,
+        dropShadowColor: Color.gray)
     
     public static let barChartStyleOrangeLight = ChartStyle(
         backgroundColor: Color.white,
         accentColor: Colors.OrangeStart,
         secondGradientColor: Colors.OrangeEnd,
-        chartFormSize: Form.medium,
         textColor: Color.black,
-        legendTextColor: Color.gray)
+        legendTextColor: Color.gray,
+        dropShadowColor: Color.gray)
     
     public static let barChartStyleOrangeDark = ChartStyle(
         backgroundColor: Color.black,
         accentColor: Colors.OrangeStart,
         secondGradientColor: Colors.OrangeEnd,
-        chartFormSize: Form.medium,
         textColor: Color.white,
-        legendTextColor: Color.gray)
+        legendTextColor: Color.gray,
+        dropShadowColor: Color.gray)
     
     public static let barChartStyleNeonBlueLight = ChartStyle(
         backgroundColor: Color.white,
         accentColor: Colors.GradientNeonBlue,
         secondGradientColor: Colors.GradientPurple,
-        chartFormSize: Form.medium,
         textColor: Color.black,
-        legendTextColor: Color.gray)
+        legendTextColor: Color.gray,
+        dropShadowColor: Color.gray)
     
     public static let barChartStyleNeonBlueDark = ChartStyle(
         backgroundColor: Color.black,
         accentColor: Colors.GradientNeonBlue,
         secondGradientColor: Colors.GradientPurple,
-        chartFormSize: Form.medium,
         textColor: Color.white,
-        legendTextColor: Color.gray)
+        legendTextColor: Color.gray,
+        dropShadowColor: Color.gray)
     
     public static let barChartMidnightGreenDark = ChartStyle(
         backgroundColor: Color(hexString: "#36534D"), //3B5147, 313D34
         accentColor: Color(hexString: "#FFD603"),
         secondGradientColor: Color(hexString: "#FFCA04"),
-        chartFormSize: Form.medium,
         textColor: Color.white,
-        legendTextColor: Color(hexString: "#D2E5E1"))
+        legendTextColor: Color(hexString: "#D2E5E1"),
+        dropShadowColor: Color.gray)
     
     public static let barChartMidnightGreenLight = ChartStyle(
         backgroundColor: Color.white,
         accentColor: Color(hexString: "#84A094"), //84A094 , 698378
         secondGradientColor: Color(hexString: "#50675D"),
-        chartFormSize: Form.medium,
         textColor: Color.black,
-        legendTextColor:Color.gray)
+        legendTextColor:Color.gray,
+        dropShadowColor: Color.gray)
     
     public static let pieChartStyleOne = ChartStyle(
         backgroundColor: Color.white,
+        accentColor: Colors.OrangeEnd,
+        secondGradientColor: Colors.OrangeStart,
+        textColor: Color.black,
+        legendTextColor: Color.gray,
+        dropShadowColor: Color.gray)
+    
+    public static let lineViewDarkMode = ChartStyle(
+        backgroundColor: Color.black,
         accentColor: Colors.OrangeStart,
         secondGradientColor: Colors.OrangeEnd,
-        chartFormSize: Form.medium,
-        textColor: Color.black,
-        legendTextColor: Color.gray)
+        textColor: Color.white,
+        legendTextColor: Color.white,
+        dropShadowColor: Color.gray)
 }
 
-public struct Form {
+public struct ChartForm {
+    #if os(watchOS)
+    public static let small = CGSize(width:120, height:90)
+    public static let medium = CGSize(width:120, height:160)
+    public static let large = CGSize(width:180, height:90)
+    public static let detail = CGSize(width:180, height:160)
+    #else
     public static let small = CGSize(width:180, height:120)
     public static let medium = CGSize(width:180, height:240)
     public static let large = CGSize(width:360, height:120)
     public static let detail = CGSize(width:180, height:120)
+    #endif
+    
+    
 }
 
-public struct ChartStyle {
+public class ChartStyle {
     public var backgroundColor: Color
     public var accentColor: Color
-    public var secondGradientColor: Color
-    public var chartFormSize: CGSize
+    public var gradientColor: GradientColor
     public var textColor: Color
     public var legendTextColor: Color
+    public var dropShadowColor: Color
+    public weak var darkModeStyle: ChartStyle?
     
-    public init(backgroundColor: Color, accentColor: Color, secondGradientColor: Color, chartFormSize: CGSize, textColor: Color, legendTextColor: Color){
+    public init(backgroundColor: Color, accentColor: Color, secondGradientColor: Color, textColor: Color, legendTextColor: Color, dropShadowColor: Color){
         self.backgroundColor = backgroundColor
         self.accentColor = accentColor
-        self.secondGradientColor = secondGradientColor
-        self.chartFormSize = chartFormSize
+        self.gradientColor = GradientColor(start: accentColor, end: secondGradientColor)
         self.textColor = textColor
         self.legendTextColor = legendTextColor
+        self.dropShadowColor = dropShadowColor
+    }
+    
+    public init(backgroundColor: Color, accentColor: Color, gradientColor: GradientColor, textColor: Color, legendTextColor: Color, dropShadowColor: Color){
+        self.backgroundColor = backgroundColor
+        self.accentColor = accentColor
+        self.gradientColor = gradientColor
+        self.textColor = textColor
+        self.legendTextColor = legendTextColor
+        self.dropShadowColor = dropShadowColor
     }
     
     public init(formSize: CGSize){
         self.backgroundColor = Color.white
         self.accentColor = Colors.OrangeStart
-        self.secondGradientColor = Colors.OrangeEnd
-        self.chartFormSize = formSize
+        self.gradientColor = GradientColors.orange
         self.legendTextColor = Color.gray
         self.textColor = Color.black
+        self.dropShadowColor = Color.gray
     }
 }
 
-class ChartData: ObservableObject {
-    @Published var points: [Int] = [Int]()
-    @Published var currentPoint: Int? = nil
+public class ChartData: ObservableObject, Identifiable {
+    @Published var points: [(String,Double)]
+    var valuesGiven: Bool = false
+    var ID = UUID()
     
-    init(points:[Int]) {
-        self.points = points
+    public init<N: BinaryFloatingPoint>(points:[N]) {
+        self.points = points.map{("", Double($0))}
+    }
+    public init<N: BinaryInteger>(values:[(String,N)]){
+        self.points = values.map{($0.0, Double($0.1))}
+        self.valuesGiven = true
+    }
+    public init<N: BinaryFloatingPoint>(values:[(String,N)]){
+        self.points = values.map{($0.0, Double($0.1))}
+        self.valuesGiven = true
+    }
+    public init<N: BinaryInteger>(numberValues:[(N,N)]){
+        self.points = numberValues.map{(String($0.0), Double($0.1))}
+        self.valuesGiven = true
+    }
+    public init<N: BinaryFloatingPoint & LosslessStringConvertible>(numberValues:[(N,N)]){
+        self.points = numberValues.map{(String($0.0), Double($0.1))}
+        self.valuesGiven = true
+    }
+    
+    public func onlyPoints() -> [Double] {
+        return self.points.map{ $0.1 }
     }
 }
 
-class TestData{
+public class MultiLineChartData: ChartData {
+    var gradient: GradientColor
+    
+    public init<N: BinaryFloatingPoint>(points:[N], gradient: GradientColor) {
+        self.gradient = gradient
+        super.init(points: points)
+    }
+    
+    public init<N: BinaryFloatingPoint>(points:[N], color: Color) {
+        self.gradient = GradientColor(start: color, end: color)
+        super.init(points: points)
+    }
+    
+    public func getGradient() -> GradientColor {
+        return self.gradient
+    }
+}
+
+public class TestData{
     static public var data:ChartData = ChartData(points: [37,72,51,22,39,47,66,85,50])
+    static public var values:ChartData = ChartData(values: [("2017 Q3",220),
+                                                            ("2017 Q4",1550),
+                                                            ("2018 Q1",8180),
+                                                            ("2018 Q2",18440),
+                                                            ("2018 Q3",55840),
+                                                            ("2018 Q4",63150), ("2019 Q1",50900), ("2019 Q2",77550), ("2019 Q3",79600), ("2019 Q4",92550)])
+    
 }
 
 extension Color {
     init(hexString: String) {
         let hex = hexString.trimmingCharacters(in: CharacterSet.alphanumerics.inverted)
-        var int = UInt32()
-        Scanner(string: hex).scanHexInt32(&int)
-        let r, g, b: UInt32
+        var int = UInt64()
+        Scanner(string: hex).scanHexInt64(&int)
+        let r, g, b: UInt64
         switch hex.count {
         case 3: // RGB (12-bit)
             (r, g, b) = ((int >> 8) * 17, (int >> 4 & 0xF) * 17, (int & 0xF) * 17)
@@ -163,3 +261,18 @@ extension Color {
         self.init(red: Double(r) / 255, green: Double(g) / 255, blue: Double(b) / 255)
     }
 }
+
+class HapticFeedback {
+    #if os(watchOS)
+    //watchOS implementation
+    static func playSelection() -> Void {
+        WKInterfaceDevice.current().play(.click)
+    }
+    #else
+    //iOS implementation
+    let selectionFeedbackGenerator = UISelectionFeedbackGenerator()
+    static func playSelection() -> Void {
+        UISelectionFeedbackGenerator().selectionChanged()
+    }
+    #endif
+}

Sources/SwiftUICharts/LineChart/Legend.swift

@@ -12,23 +12,41 @@ struct Legend: View {
     @ObservedObject var data: ChartData
     @Binding var frame: CGRect
     @Binding var hideHorizontalLines: Bool
-    
+    @Environment(\.colorScheme) var colorScheme: ColorScheme
+    let padding:CGFloat = 3
+
     var stepWidth: CGFloat {
+        if data.points.count < 2 {
+            return 0
+        }
         return frame.size.width / CGFloat(data.points.count-1)
     }
     var stepHeight: CGFloat {
-        return frame.size.height / CGFloat(data.points.max()! + data.points.min()!)
+        let points = self.data.onlyPoints()
+        if let min = points.min(), let max = points.max(), min != max {
+            if (min < 0){
+                return (frame.size.height-padding) / CGFloat(max - min)
+            }else{
+                return (frame.size.height-padding) / CGFloat(max + min)
+            }
+        }
+        return 0
+    }
+    
+    var min: CGFloat {
+        let points = self.data.onlyPoints()
+        return CGFloat(points.min() ?? 0)
     }
     
     var body: some View {
         ZStack(alignment: .topLeading){
             ForEach((0...4), id: \.self) { height in
                 HStack(alignment: .center){
-                    Text("\(self.getYLegend()![height])").offset(x: 0, y: (self.frame.height-CGFloat(self.getYLegend()![height])*self.stepHeight)-(self.frame.height/2))
+                    Text("\(self.getYLegendSafe(height: height), specifier: "%.2f")").offset(x: 0, y: self.getYposition(height: height) )
                         .foregroundColor(Colors.LegendText)
                         .font(.caption)
-                     self.line(atHeight: CGFloat(self.getYLegend()![height]), width: self.frame.width)
-                        .stroke(Colors.LegendColor, style: StrokeStyle(lineWidth: 1.5, lineCap: .round, dash: [5,height == 0 ? 0 : 10]))
+                    self.line(atHeight: self.getYLegendSafe(height: height), width: self.frame.width)
+                        .stroke(self.colorScheme == .dark ? Colors.LegendDarkColor : Colors.LegendColor, style: StrokeStyle(lineWidth: 1.5, lineCap: .round, dash: [5,height == 0 ? 0 : 10]))
                         .opacity((self.hideHorizontalLines && height != 0) ? 0 : 1)
                         .rotationEffect(.degrees(180), anchor: .center)
                         .rotation3DEffect(.degrees(180), axis: (x: 0, y: 1, z: 0))
@@ -41,30 +59,41 @@ struct Legend: View {
         }
     }
     
+    func getYLegendSafe(height:Int)->CGFloat{
+        if let legend = getYLegend() {
+            return CGFloat(legend[height])
+        }
+        return 0
+    }
+    
+    func getYposition(height: Int)-> CGFloat {
+        if let legend = getYLegend() {
+            return (self.frame.height-((CGFloat(legend[height]) - min)*self.stepHeight))-(self.frame.height/2)
+        }
+        return 0
+       
+    }
+    
     func line(atHeight: CGFloat, width: CGFloat) -> Path {
         var hLine = Path()
-        hLine.move(to: CGPoint(x:5, y: atHeight*stepHeight))
-        hLine.addLine(to: CGPoint(x: width, y: atHeight*stepHeight))
+        hLine.move(to: CGPoint(x:5, y: (atHeight-min)*stepHeight))
+        hLine.addLine(to: CGPoint(x: width, y: (atHeight-min)*stepHeight))
         return hLine
     }
     
-    func getYLegend() -> [Int]? {
-        guard let max = data.points.max() else { return nil }
-        guard let min = data.points.min() else { return nil }
-        if(min > 0){
-            let upperBound = ((max/10)+1) * 10
-            let step = upperBound/4
-            return [step * 0,step * 1, step * 2, step * 3, step * 4]
-        }
-        
-        return nil
+    func getYLegend() -> [Double]? {
+        let points = self.data.onlyPoints()
+        guard let max = points.max() else { return nil }
+        guard let min = points.min() else { return nil }
+        let step = Double(max - min)/4
+        return [min+step * 0, min+step * 1, min+step * 2, min+step * 3, min+step * 4]
     }
 }
 
 struct Legend_Previews: PreviewProvider {
     static var previews: some View {
         GeometryReader{ geometry in
-            Legend(data: TestData.data, frame: .constant(geometry.frame(in: .local)), hideHorizontalLines: .constant(false))
+            Legend(data: ChartData(points: [0.2,0.4,1.4,4.5]), frame: .constant(geometry.frame(in: .local)), hideHorizontalLines: .constant(false))
         }.frame(width: 320, height: 200)
     }
 }

Sources/SwiftUICharts/LineChart/Line.swift

@@ -8,28 +8,58 @@
 
 import SwiftUI
 
-struct Line: View {
+public struct Line: View {
     @ObservedObject var data: ChartData
     @Binding var frame: CGRect
     @Binding var touchLocation: CGPoint
     @Binding var showIndicator: Bool
+    @Binding var minDataValue: Double?
+    @Binding var maxDataValue: Double?
     @State private var showFull: Bool = false
     @State var showBackground: Bool = true
-    
+    var gradient: GradientColor = GradientColor(start: Colors.GradientPurple, end: Colors.GradientNeonBlue)
+    var index:Int = 0
+    let padding:CGFloat = 30
+    var curvedLines: Bool = true
     var stepWidth: CGFloat {
+        if data.points.count < 2 {
+            return 0
+        }
         return frame.size.width / CGFloat(data.points.count-1)
     }
     var stepHeight: CGFloat {
-        return frame.size.height / CGFloat(data.points.max()! + data.points.min()!)
+        var min: Double?
+        var max: Double?
+        let points = self.data.onlyPoints()
+        if minDataValue != nil && maxDataValue != nil {
+            min = minDataValue!
+            max = maxDataValue!
+            print(min,max)
+        }else if let minPoint = points.min(), let maxPoint = points.max(), minPoint != maxPoint {
+            min = minPoint
+            max = maxPoint
+        }else {
+            return 0
+        }
+        if let min = min, let max = max, min != max {
+            if (min <= 0){
+                return (frame.size.height-padding) / CGFloat(max - min)
+            }else{
+                return (frame.size.height-padding) / CGFloat(max + min)
+            }
+        }
+        return 0
     }
     var path: Path {
-        return Path.quadCurvedPathWithPoints(points: data.points, step: CGPoint(x: stepWidth, y: stepHeight))
+        let points = self.data.onlyPoints()
+        return curvedLines ? Path.quadCurvedPathWithPoints(points: points, step: CGPoint(x: stepWidth, y: stepHeight), globalOffset: minDataValue) : Path.linePathWithPoints(points: points, step: CGPoint(x: stepWidth, y: stepHeight))
     }
     var closedPath: Path {
-        return Path.quadClosedCurvedPathWithPoints(points: data.points, step: CGPoint(x: stepWidth, y: stepHeight))
+        let points = self.data.onlyPoints()
+        return curvedLines ? Path.quadClosedCurvedPathWithPoints(points: points, step: CGPoint(x: stepWidth, y: stepHeight), globalOffset: minDataValue) : Path.closedLinePathWithPoints(points: points, step: CGPoint(x: stepWidth, y: stepHeight))
     }
     
-    var body: some View {
+    public var body: some View {
         ZStack {
             if(self.showFull && self.showBackground){
                 self.closedPath
@@ -41,13 +71,17 @@ struct Line: View {
             }
             self.path
                 .trim(from: 0, to: self.showFull ? 1:0)
-                .stroke(LinearGradient(gradient: Gradient(colors: [Colors.GradientPurple, Colors.GradientNeonBlue]), startPoint: .leading, endPoint: .trailing) ,style: StrokeStyle(lineWidth: 3))
+                .stroke(LinearGradient(gradient: gradient.getGradient(), startPoint: .leading, endPoint: .trailing) ,style: StrokeStyle(lineWidth: 3, lineJoin: .round))
                 .rotationEffect(.degrees(180), anchor: .center)
                 .rotation3DEffect(.degrees(180), axis: (x: 0, y: 1, z: 0))
-                .animation(.easeOut(duration: 1.2))
-                .onAppear(){
-                    self.showFull.toggle()
-            }.drawingGroup()
+                .animation(Animation.easeOut(duration: 1.2).delay(Double(self.index)*0.4))
+                .onAppear {
+                    self.showFull = true
+            }
+            .onDisappear {
+                self.showFull = false
+            }
+            .drawingGroup()
             if(self.showIndicator) {
                 IndicatorPoint()
                     .position(self.getClosestPointOnPath(touchLocation: self.touchLocation))
@@ -58,102 +92,16 @@ struct Line: View {
     }
     
     func getClosestPointOnPath(touchLocation: CGPoint) -> CGPoint {
-        let percentage:CGFloat = min(max(touchLocation.x,0)/self.frame.width,1)
-        let closest = self.path.percentPoint(percentage)
+        let closest = self.path.point(to: touchLocation.x)
         return closest
     }
     
 }
 
-extension CGPoint {
-    static func getMidPoint(point1: CGPoint, point2: CGPoint) -> CGPoint {
-      return CGPoint(
-        x: point1.x + (point2.x - point1.x) / 2,
-        y: point1.y + (point2.y - point1.y) / 2
-      )
-    }
-    
-    func dist(to: CGPoint) -> CGFloat {
-      return sqrt((pow(self.x - to.x, 2) + pow(self.y - to.y, 2)))
-    }
-    
-    static func midPointForPoints(p1:CGPoint, p2:CGPoint) -> CGPoint {
-        return CGPoint(x:(p1.x + p2.x) / 2,y: (p1.y + p2.y) / 2)
-    }
-
-    static func controlPointForPoints(p1:CGPoint, p2:CGPoint) -> CGPoint {
-        var controlPoint = CGPoint.midPointForPoints(p1:p1, p2:p2)
-        let diffY = abs(p2.y - controlPoint.y)
-
-        if (p1.y < p2.y){
-            controlPoint.y += diffY
-        } else if (p1.y > p2.y) {
-            controlPoint.y -= diffY
-        }
-        return controlPoint
-    }
-}
-extension Path {
-    static func quadCurvedPathWithPoints(points:[Int], step:CGPoint) -> Path {
-        var path = Path()
-        var p1 = CGPoint(x: 0, y: CGFloat(points[0])*step.y)
-        path.move(to: p1)
-        if(points.count < 2){
-            path.addLine(to: CGPoint(x: step.x, y: step.y*CGFloat(points[1])))
-            return path
-        }
-        for pointIndex in 1..<points.count {
-            let p2 = CGPoint(x: step.x * CGFloat(pointIndex), y: step.y*CGFloat(points[pointIndex]))
-            let midPoint = CGPoint.midPointForPoints(p1: p1, p2: p2)
-            path.addQuadCurve(to: midPoint, control: CGPoint.controlPointForPoints(p1: midPoint, p2: p1))
-            path.addQuadCurve(to: p2, control: CGPoint.controlPointForPoints(p1: midPoint, p2: p2))
-            p1 = p2
-        }
-        return path
-    }
-    
-    static func quadClosedCurvedPathWithPoints(points:[Int], step:CGPoint) -> Path {
-        var path = Path()
-        path.move(to: .zero)
-        var p1 = CGPoint(x: 0, y: CGFloat(points[0])*step.y)
-        path.addLine(to: p1)
-        if(points.count < 2){
-            path.addLine(to: CGPoint(x: step.x, y: step.y*CGFloat(points[1])))
-            return path
-        }
-        for pointIndex in 1..<points.count {
-            let p2 = CGPoint(x: step.x * CGFloat(pointIndex), y: step.y*CGFloat(points[pointIndex]))
-            let midPoint = CGPoint.midPointForPoints(p1: p1, p2: p2)
-            path.addQuadCurve(to: midPoint, control: CGPoint.controlPointForPoints(p1: midPoint, p2: p1))
-            path.addQuadCurve(to: p2, control: CGPoint.controlPointForPoints(p1: midPoint, p2: p2))
-            p1 = p2
-        }
-        path.addLine(to: CGPoint(x: p1.x, y: 0))
-        path.closeSubpath()
-        return path
-    }
-    
-    func percentPoint(_ percent: CGFloat) -> CGPoint {
-        // percent difference between points
-        let diff: CGFloat = 0.001
-        let comp: CGFloat = 1 - diff
-        
-        // handle limits
-        let pct = percent > 1 ? 0 : (percent < 0 ? 1 : percent)
-        
-        let f = pct > comp ? comp : pct
-        let t = pct > comp ? 1 : pct + diff
-        let tp = self.trimmedPath(from: f, to: t)
-        
-        return CGPoint(x: tp.boundingRect.midX, y: tp.boundingRect.midY)
-    }
-    
-}
-
 struct Line_Previews: PreviewProvider {
     static var previews: some View {
         GeometryReader{ geometry in
-            Line(data: TestData.data, frame: .constant(geometry.frame(in: .local)), touchLocation: .constant(CGPoint(x: 300, y: 12)), showIndicator: .constant(true))
+            Line(data: ChartData(points: [12,-230,10,54]), frame: .constant(geometry.frame(in: .local)), touchLocation: .constant(CGPoint(x: 100, y: 12)), showIndicator: .constant(true), minDataValue: .constant(nil), maxDataValue: .constant(nil))
         }.frame(width: 320, height: 160)
     }
 }

Sources/SwiftUICharts/LineChart/LineChartView.swift

@@ -9,43 +9,75 @@
 import SwiftUI
 
 public struct LineChartView: View {
-    let selectionFeedbackGenerator = UISelectionFeedbackGenerator()
+    @Environment(\.colorScheme) var colorScheme: ColorScheme
     @ObservedObject var data:ChartData
     public var title: String
     public var legend: String?
     public var style: ChartStyle
+    public var darkModeStyle: ChartStyle
+    
+    public var formSize:CGSize
+    public var dropShadow: Bool
+    public var valueSpecifier:String
+    
     @State private var touchLocation:CGPoint = .zero
     @State private var showIndicatorDot: Bool = false
-    @State private var currentValue: Int = 2 {
+    @State private var currentValue: Double = 2 {
         didSet{
             if (oldValue != self.currentValue && showIndicatorDot) {
-                selectionFeedbackGenerator.selectionChanged()
+                HapticFeedback.playSelection()
             }
             
         }
     }
     let frame = CGSize(width: 180, height: 120)
+    private var rateValue: Int
     
-    public init(data: [Int], title: String, legend: String? = nil, style: ChartStyle = Styles.lineChartStyleOne ){
+    public init(data: [Double],
+                title: String,
+                legend: String? = nil,
+                style: ChartStyle = Styles.lineChartStyleOne,
+                form: CGSize? = ChartForm.medium,
+                rateValue: Int? = 14,
+                dropShadow: Bool? = true,
+                valueSpecifier: String? = "%.1f") {
+        
         self.data = ChartData(points: data)
         self.title = title
         self.legend = legend
         self.style = style
+        self.darkModeStyle = style.darkModeStyle != nil ? style.darkModeStyle! : Styles.lineViewDarkMode
+        self.formSize = form!
+        self.rateValue = rateValue!
+        self.dropShadow = dropShadow!
+        self.valueSpecifier = valueSpecifier!
     }
     
     public var body: some View {
         ZStack(alignment: .center){
-            RoundedRectangle(cornerRadius: 20).fill(self.style.backgroundColor).frame(width: frame.width, height: 240, alignment: .center).shadow(radius: 8)
+            RoundedRectangle(cornerRadius: 20)
+                .fill(self.colorScheme == .dark ? self.darkModeStyle.backgroundColor : self.style.backgroundColor)
+                .frame(width: frame.width, height: 240, alignment: .center)
+                .shadow(color: self.style.dropShadowColor, radius: self.dropShadow ? 8 : 0)
             VStack(alignment: .leading){
                 if(!self.showIndicatorDot){
                     VStack(alignment: .leading, spacing: 8){
-                        Text(self.title).font(.title).bold().foregroundColor(self.style.textColor)
+                        Text(self.title)
+                            .font(.title)
+                            .bold()
+                            .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.textColor : self.style.textColor)
                         if (self.legend != nil){
-                            Text(self.legend!).font(.callout).foregroundColor(self.style.legendTextColor)
+                            Text(self.legend!)
+                                .font(.callout)
+                                .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.legendTextColor :self.style.legendTextColor)
                         }
                         HStack {
-                            Image(systemName: "arrow.up")
-                            Text("14%")
+                            if (self.rateValue >= 0){
+                                Image(systemName: "arrow.up")
+                            }else{
+                                Image(systemName: "arrow.down")
+                            }
+                            Text("\(self.rateValue)%")
                         }
                     }
                     .transition(.opacity)
@@ -54,23 +86,27 @@ public struct LineChartView: View {
                 }else{
                     HStack{
                         Spacer()
-                        Text("\(self.currentValue)")
+                        Text("\(self.currentValue, specifier: self.valueSpecifier)")
                             .font(.system(size: 41, weight: .bold, design: .default))
                             .offset(x: 0, y: 30)
                         Spacer()
                     }
                     .transition(.scale)
-                    .animation(.spring())
-                    
                 }
                 Spacer()
                 GeometryReader{ geometry in
-                    Line(data: self.data, frame: .constant(geometry.frame(in: .local)), touchLocation: self.$touchLocation, showIndicator: self.$showIndicatorDot)
+                    Line(data: self.data,
+                        frame: .constant(geometry.frame(in: .local)),
+                        touchLocation: self.$touchLocation,
+                        showIndicator: self.$showIndicatorDot,
+                        minDataValue: .constant(nil),
+                        maxDataValue: .constant(nil)
+                    )
                 }
-                .frame(width: frame.width, height: frame.height)
+                .frame(width: frame.width, height: frame.height + 30)
                 .clipShape(RoundedRectangle(cornerRadius: 20))
                 .offset(x: 0, y: 0)
-            }.frame(width: self.style.chartFormSize.width, height: self.style.chartFormSize.height)
+            }.frame(width: self.formSize.width, height: self.formSize.height)
         }
         .gesture(DragGesture()
         .onChanged({ value in
@@ -84,14 +120,15 @@ public struct LineChartView: View {
         )
     }
     
-    func getClosestDataPoint(toPoint: CGPoint, width:CGFloat, height: CGFloat) -> CGPoint {
-        let stepWidth: CGFloat = width / CGFloat(data.points.count-1)
-        let stepHeight: CGFloat = height / CGFloat(data.points.max()! + data.points.min()!)
+    @discardableResult func getClosestDataPoint(toPoint: CGPoint, width:CGFloat, height: CGFloat) -> CGPoint {
+        let points = self.data.onlyPoints()
+        let stepWidth: CGFloat = width / CGFloat(points.count-1)
+        let stepHeight: CGFloat = height / CGFloat(points.max()! + points.min()!)
         
         let index:Int = Int(round((toPoint.x)/stepWidth))
-        if (index >= 0 && index < data.points.count){
-            self.currentValue = self.data.points[index]
-            return CGPoint(x: CGFloat(index)*stepWidth, y: CGFloat(self.data.points[index])*stepHeight)
+        if (index >= 0 && index < points.count){
+            self.currentValue = points[index]
+            return CGPoint(x: CGFloat(index)*stepWidth, y: CGFloat(points[index])*stepHeight)
         }
         return .zero
     }

Sources/SwiftUICharts/LineChart/LineView.swift

@@ -0,0 +1,126 @@
+//
+//  LineView.swift
+//  LineChart
+//
+//  Created by András Samu on 2019. 09. 02..
+//  Copyright © 2019. András Samu. All rights reserved.
+//
+
+import SwiftUI
+
+public struct LineView: View {
+    @ObservedObject var data: ChartData
+    public var title: String?
+    public var legend: String?
+    public var style: ChartStyle
+    public var darkModeStyle: ChartStyle
+    public var valueSpecifier:String
+    
+    @Environment(\.colorScheme) var colorScheme: ColorScheme
+    @State private var showLegend = false
+    @State private var dragLocation:CGPoint = .zero
+    @State private var indicatorLocation:CGPoint = .zero
+    @State private var closestPoint: CGPoint = .zero
+    @State private var opacity:Double = 0
+    @State private var currentDataNumber: Double = 0
+    @State private var hideHorizontalLines: Bool = false
+    
+    public init(data: [Double],
+                title: String? = nil,
+                legend: String? = nil,
+                style: ChartStyle = Styles.lineChartStyleOne,
+                valueSpecifier: String? = "%.1f") {
+        
+        self.data = ChartData(points: data)
+        self.title = title
+        self.legend = legend
+        self.style = style
+        self.valueSpecifier = valueSpecifier!
+        self.darkModeStyle = style.darkModeStyle != nil ? style.darkModeStyle! : Styles.lineViewDarkMode
+    }
+    
+    public var body: some View {
+        GeometryReader{ geometry in
+            VStack(alignment: .leading, spacing: 8) {
+                Group{
+                    if (self.title != nil){
+                        Text(self.title!)
+                            .font(.title)
+                            .bold().foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.textColor : self.style.textColor)
+                    }
+                    if (self.legend != nil){
+                        Text(self.legend!)
+                            .font(.callout)
+                            .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.legendTextColor : self.style.legendTextColor)
+                    }
+                }.offset(x: 0, y: 20)
+                ZStack{
+                    GeometryReader{ reader in
+                        Rectangle()
+                            .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.backgroundColor : self.style.backgroundColor)
+                        if(self.showLegend){
+                            Legend(data: self.data,
+                                   frame: .constant(reader.frame(in: .local)), hideHorizontalLines: self.$hideHorizontalLines)
+                                .transition(.opacity)
+                                .animation(Animation.easeOut(duration: 1).delay(1))
+                        }
+                        Line(data: self.data,
+                             frame: .constant(CGRect(x: 0, y: 0, width: reader.frame(in: .local).width - 30, height: reader.frame(in: .local).height)),
+                             touchLocation: self.$indicatorLocation,
+                             showIndicator: self.$hideHorizontalLines,
+                             minDataValue: .constant(nil),
+                             maxDataValue: .constant(nil),
+                             showBackground: false
+                        )
+                        .offset(x: 30, y: 0)
+                        .onAppear(){
+                            self.showLegend = true
+                        }
+                        .onDisappear(){
+                            self.showLegend = false
+                        }
+                    }
+                    .frame(width: geometry.frame(in: .local).size.width, height: 240)
+                    .offset(x: 0, y: 40 )
+                    MagnifierRect(currentNumber: self.$currentDataNumber, valueSpecifier: self.valueSpecifier)
+                        .opacity(self.opacity)
+                        .offset(x: self.dragLocation.x - geometry.frame(in: .local).size.width/2, y: 36)
+                }
+                .frame(width: geometry.frame(in: .local).size.width, height: 240)
+                .gesture(DragGesture()
+                .onChanged({ value in
+                    self.dragLocation = value.location
+                    self.indicatorLocation = CGPoint(x: max(value.location.x-30,0), y: 32)
+                    self.opacity = 1
+                    self.closestPoint = self.getClosestDataPoint(toPoint: value.location, width: geometry.frame(in: .local).size.width-30, height: 240)
+                    self.hideHorizontalLines = true
+                })
+                    .onEnded({ value in
+                        self.opacity = 0
+                        self.hideHorizontalLines = false
+                    })
+                )
+            }
+        }
+    }
+    
+    func getClosestDataPoint(toPoint: CGPoint, width:CGFloat, height: CGFloat) -> CGPoint {
+        let points = self.data.onlyPoints()
+        let stepWidth: CGFloat = width / CGFloat(points.count-1)
+        let stepHeight: CGFloat = height / CGFloat(points.max()! + points.min()!)
+        
+        let index:Int = Int(floor((toPoint.x-15)/stepWidth))
+        if (index >= 0 && index < points.count){
+            self.currentDataNumber = points[index]
+            return CGPoint(x: CGFloat(index)*stepWidth, y: CGFloat(points[index])*stepHeight)
+        }
+        return .zero
+    }
+}
+
+struct LineView_Previews: PreviewProvider {
+    static var previews: some View {
+        LineView(data: [8,23,54,32,12,37,7,23,43], title: "Full chart", style: Styles.lineChartStyleOne)
+    }
+}
+

Sources/SwiftUICharts/LineChart/MagnifierRect.swift

@@ -0,0 +1,33 @@
+//
+//  MagnifierRect.swift
+//  
+//
+//  Created by Samu András on 2020. 03. 04..
+//
+
+import SwiftUI
+
+public struct MagnifierRect: View {
+    @Binding var currentNumber: Double
+    var valueSpecifier:String
+    @Environment(\.colorScheme) var colorScheme: ColorScheme
+    public var body: some View {
+        ZStack{
+            Text("\(self.currentNumber, specifier: valueSpecifier)")
+                .font(.system(size: 18, weight: .bold))
+                .offset(x: 0, y:-110)
+                .foregroundColor(self.colorScheme == .dark ? Color.white : Color.black)
+            if (self.colorScheme == .dark ){
+                RoundedRectangle(cornerRadius: 16)
+                    .stroke(Color.white, lineWidth: self.colorScheme == .dark ? 2 : 0)
+                    .frame(width: 60, height: 260)
+            }else{
+                RoundedRectangle(cornerRadius: 16)
+                    .frame(width: 60, height: 280)
+                    .foregroundColor(Color.white)
+                    .shadow(color: Colors.LegendText, radius: 12, x: 0, y: 6 )
+                    .blendMode(.multiply)
+            }
+        }
+    }
+}

Sources/SwiftUICharts/LineChart/MultiLineChartView.swift

@@ -0,0 +1,163 @@
+//
+//  File.swift
+//  
+//
+//  Created by Samu András on 2020. 02. 19..
+//
+
+import SwiftUI
+
+public struct MultiLineChartView: View {
+    @Environment(\.colorScheme) var colorScheme: ColorScheme
+    var data:[MultiLineChartData]
+    public var title: String
+    public var legend: String?
+    public var style: ChartStyle
+    public var darkModeStyle: ChartStyle
+    public var formSize:CGSize
+    public var dropShadow: Bool
+    public var valueSpecifier:String
+    
+    @State private var touchLocation:CGPoint = .zero
+    @State private var showIndicatorDot: Bool = false
+    @State private var currentValue: Double = 2 {
+        didSet{
+            if (oldValue != self.currentValue && showIndicatorDot) {
+                HapticFeedback.playSelection()
+            }
+            
+        }
+    }
+    
+    var globalMin:Double {
+        if let min = data.flatMap({$0.onlyPoints()}).min() {
+            return min
+        }
+        return 0
+    }
+    
+    var globalMax:Double {
+        if let max = data.flatMap({$0.onlyPoints()}).max() {
+            return max
+        }
+        return 0
+    }
+    
+    let frame = CGSize(width: 180, height: 120)
+    private var rateValue: Int
+    
+    public init(data: [([Double], GradientColor)],
+                title: String,
+                legend: String? = nil,
+                style: ChartStyle = Styles.lineChartStyleOne,
+                form: CGSize? = ChartForm.medium,
+                rateValue: Int? = 14,
+                dropShadow: Bool? = true,
+                valueSpecifier: String? = "%.1f") {
+        
+        self.data = data.map({ MultiLineChartData(points: $0.0, gradient: $0.1)})
+        self.title = title
+        self.legend = legend
+        self.style = style
+        self.darkModeStyle = style.darkModeStyle != nil ? style.darkModeStyle! : Styles.lineViewDarkMode
+        self.formSize = form!
+        self.rateValue = rateValue!
+        self.dropShadow = dropShadow!
+        self.valueSpecifier = valueSpecifier!
+    }
+    
+    public var body: some View {
+        ZStack(alignment: .center){
+            RoundedRectangle(cornerRadius: 20)
+                .fill(self.colorScheme == .dark ? self.darkModeStyle.backgroundColor : self.style.backgroundColor)
+                .frame(width: frame.width, height: 240, alignment: .center)
+                .shadow(radius: self.dropShadow ? 8 : 0)
+            VStack(alignment: .leading){
+                if(!self.showIndicatorDot){
+                    VStack(alignment: .leading, spacing: 8){
+                        Text(self.title)
+                            .font(.title)
+                            .bold()
+                            .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.textColor : self.style.textColor)
+                        if (self.legend != nil){
+                            Text(self.legend!)
+                                .font(.callout)
+                                .foregroundColor(self.colorScheme == .dark ? self.darkModeStyle.legendTextColor : self.style.legendTextColor)
+                        }
+                        HStack {
+                            if (self.rateValue >= 0){
+                                Image(systemName: "arrow.up")
+                            }else{
+                                Image(systemName: "arrow.down")
+                            }
+                            Text("\(self.rateValue)%")
+                        }
+                    }
+                    .transition(.opacity)
+                    .animation(.easeIn(duration: 0.1))
+                    .padding([.leading, .top])
+                }else{
+                    HStack{
+                        Spacer()
+                        Text("\(self.currentValue, specifier: self.valueSpecifier)")
+                            .font(.system(size: 41, weight: .bold, design: .default))
+                            .offset(x: 0, y: 30)
+                        Spacer()
+                    }
+                    .transition(.scale)
+                }
+                Spacer()
+                GeometryReader{ geometry in
+                    ZStack{
+                        ForEach(0..<self.data.count) { i in
+                            Line(data: self.data[i],
+                                 frame: .constant(geometry.frame(in: .local)),
+                                 touchLocation: self.$touchLocation,
+                                 showIndicator: self.$showIndicatorDot,
+                                 minDataValue: .constant(self.globalMin),
+                                 maxDataValue: .constant(self.globalMax),
+                                 showBackground: false,
+                                 gradient: self.data[i].getGradient(),
+                                 index: i)
+                        }
+                    }
+                }
+                .frame(width: frame.width, height: frame.height + 30)
+                .clipShape(RoundedRectangle(cornerRadius: 20))
+                .offset(x: 0, y: 0)
+            }.frame(width: self.formSize.width, height: self.formSize.height)
+        }
+        .gesture(DragGesture()
+        .onChanged({ value in
+//            self.touchLocation = value.location
+//            self.showIndicatorDot = true
+//            self.getClosestDataPoint(toPoint: value.location, width:self.frame.width, height: self.frame.height)
+        })
+            .onEnded({ value in
+                self.showIndicatorDot = false
+            })
+        )
+    }
+    
+//    @discardableResult func getClosestDataPoint(toPoint: CGPoint, width:CGFloat, height: CGFloat) -> CGPoint {
+//        let points = self.data.onlyPoints()
+//        let stepWidth: CGFloat = width / CGFloat(points.count-1)
+//        let stepHeight: CGFloat = height / CGFloat(points.max()! + points.min()!)
+//
+//        let index:Int = Int(round((toPoint.x)/stepWidth))
+//        if (index >= 0 && index < points.count){
+//            self.currentValue = points[index]
+//            return CGPoint(x: CGFloat(index)*stepWidth, y: CGFloat(points[index])*stepHeight)
+//        }
+//        return .zero
+//    }
+}
+
+struct MultiWidgetView_Previews: PreviewProvider {
+    static var previews: some View {
+        Group {
+            MultiLineChartView(data: [([8,23,54,32,12,37,7,23,43], GradientColors.orange)], title: "Line chart", legend: "Basic")
+                .environment(\.colorScheme, .light)
+        }
+    }
+}

Sources/SwiftUICharts/LineChart/Path+QuadCurve.swift

@@ -0,0 +1,353 @@
+//
+//  File.swift
+//  
+//
+//  Created by xspyhack on 2020/1/21.
+//
+
+import SwiftUI
+
+extension Path {
+    func trimmedPath(for percent: CGFloat) -> Path {
+        // percent difference between points
+        let boundsDistance: CGFloat = 0.001
+        let completion: CGFloat = 1 - boundsDistance
+        
+        let pct = percent > 1 ? 0 : (percent < 0 ? 1 : percent)
+        
+        let start = pct > completion ? completion : pct - boundsDistance
+        let end = pct > completion ? 1 : pct + boundsDistance
+        return trimmedPath(from: start, to: end)
+    }
+    
+    func point(for percent: CGFloat) -> CGPoint {
+        let path = trimmedPath(for: percent)
+        return CGPoint(x: path.boundingRect.midX, y: path.boundingRect.midY)
+    }
+    
+    func point(to maxX: CGFloat) -> CGPoint {
+        let total = length
+        let sub = length(to: maxX)
+        let percent = sub / total
+        return point(for: percent)
+    }
+    
+    var length: CGFloat {
+        var ret: CGFloat = 0.0
+        var start: CGPoint?
+        var point = CGPoint.zero
+        
+        forEach { ele in
+            switch ele {
+            case .move(let to):
+                if start == nil {
+                    start = to
+                }
+                point = to
+            case .line(let to):
+                ret += point.line(to: to)
+                point = to
+            case .quadCurve(let to, let control):
+                ret += point.quadCurve(to: to, control: control)
+                point = to
+            case .curve(let to, let control1, let control2):
+                ret += point.curve(to: to, control1: control1, control2: control2)
+                point = to
+            case .closeSubpath:
+                if let to = start {
+                    ret += point.line(to: to)
+                    point = to
+                }
+                start = nil
+            }
+        }
+        return ret
+    }
+    
+    func length(to maxX: CGFloat) -> CGFloat {
+        var ret: CGFloat = 0.0
+        var start: CGPoint?
+        var point = CGPoint.zero
+        var finished = false
+        
+        forEach { ele in
+            if finished {
+                return
+            }
+            switch ele {
+            case .move(let to):
+                if to.x > maxX {
+                    finished = true
+                    return
+                }
+                if start == nil {
+                    start = to
+                }
+                point = to
+            case .line(let to):
+                if to.x > maxX {
+                    finished = true
+                    ret += point.line(to: to, x: maxX)
+                    return
+                }
+                ret += point.line(to: to)
+                point = to
+            case .quadCurve(let to, let control):
+                if to.x > maxX {
+                    finished = true
+                    ret += point.quadCurve(to: to, control: control, x: maxX)
+                    return
+                }
+                ret += point.quadCurve(to: to, control: control)
+                point = to
+            case .curve(let to, let control1, let control2):
+                if to.x > maxX {
+                    finished = true
+                    ret += point.curve(to: to, control1: control1, control2: control2, x: maxX)
+                    return
+                }
+                ret += point.curve(to: to, control1: control1, control2: control2)
+                point = to
+            case .closeSubpath:
+                fatalError("Can't include closeSubpath")
+            }
+        }
+        return ret
+    }
+    
+    static func quadCurvedPathWithPoints(points:[Double], step:CGPoint, globalOffset: Double? = nil) -> Path {
+        var path = Path()
+        if (points.count < 2){
+            return path
+        }
+        let offset = globalOffset ?? points.min()!
+//        guard let offset = points.min() else { return path }
+        var p1 = CGPoint(x: 0, y: CGFloat(points[0]-offset)*step.y)
+        path.move(to: p1)
+        for pointIndex in 1..<points.count {
+            let p2 = CGPoint(x: step.x * CGFloat(pointIndex), y: step.y*CGFloat(points[pointIndex]-offset))
+            let midPoint = CGPoint.midPointForPoints(p1: p1, p2: p2)
+            path.addQuadCurve(to: midPoint, control: CGPoint.controlPointForPoints(p1: midPoint, p2: p1))
+            path.addQuadCurve(to: p2, control: CGPoint.controlPointForPoints(p1: midPoint, p2: p2))
+            p1 = p2
+        }
+        return path
+    }
+    
+    static func quadClosedCurvedPathWithPoints(points:[Double], step:CGPoint, globalOffset: Double? = nil) -> Path {
+        var path = Path()
+        if (points.count < 2){
+            return path
+        }
+        let offset = globalOffset ?? points.min()!
+
+//        guard let offset = points.min() else { return path }
+        path.move(to: .zero)
+        var p1 = CGPoint(x: 0, y: CGFloat(points[0]-offset)*step.y)
+        path.addLine(to: p1)
+        for pointIndex in 1..<points.count {
+            let p2 = CGPoint(x: step.x * CGFloat(pointIndex), y: step.y*CGFloat(points[pointIndex]-offset))
+            let midPoint = CGPoint.midPointForPoints(p1: p1, p2: p2)
+            path.addQuadCurve(to: midPoint, control: CGPoint.controlPointForPoints(p1: midPoint, p2: p1))
+            path.addQuadCurve(to: p2, control: CGPoint.controlPointForPoints(p1: midPoint, p2: p2))
+            p1 = p2
+        }
+        path.addLine(to: CGPoint(x: p1.x, y: 0))
+        path.closeSubpath()
+        return path
+    }
+    
+    static func linePathWithPoints(points:[Double], step:CGPoint) -> Path {
+        var path = Path()
+        if (points.count < 2){
+            return path
+        }
+        guard let offset = points.min() else { return path }
+        let p1 = CGPoint(x: 0, y: CGFloat(points[0]-offset)*step.y)
+        path.move(to: p1)
+        for pointIndex in 1..<points.count {
+            let p2 = CGPoint(x: step.x * CGFloat(pointIndex), y: step.y*CGFloat(points[pointIndex]-offset))
+            path.addLine(to: p2)
+        }
+        return path
+    }
+    
+    static func closedLinePathWithPoints(points:[Double], step:CGPoint) -> Path {
+        var path = Path()
+        if (points.count < 2){
+            return path
+        }
+        guard let offset = points.min() else { return path }
+        var p1 = CGPoint(x: 0, y: CGFloat(points[0]-offset)*step.y)
+        path.move(to: p1)
+        for pointIndex in 1..<points.count {
+            p1 = CGPoint(x: step.x * CGFloat(pointIndex), y: step.y*CGFloat(points[pointIndex]-offset))
+            path.addLine(to: p1)
+        }
+        path.addLine(to: CGPoint(x: p1.x, y: 0))
+        path.closeSubpath()
+        return path
+    }
+    
+}
+
+extension CGPoint {
+    func point(to: CGPoint, x: CGFloat) -> CGPoint {
+        let a = (to.y - self.y) / (to.x - self.x)
+        let y = self.y + (x - self.x) * a
+        return CGPoint(x: x, y: y)
+    }
+    
+    func line(to: CGPoint) -> CGFloat {
+        dist(to: to)
+    }
+    
+    func line(to: CGPoint, x: CGFloat) -> CGFloat {
+        dist(to: point(to: to, x: x))
+    }
+    
+    func quadCurve(to: CGPoint, control: CGPoint) -> CGFloat {
+        var dist: CGFloat = 0
+        let steps: CGFloat = 100
+        
+        for i in 0..<Int(steps) {
+            let t0 = CGFloat(i) / steps
+            let t1 = CGFloat(i+1) / steps
+            let a = point(to: to, t: t0, control: control)
+            let b = point(to: to, t: t1, control: control)
+            
+            dist += a.line(to: b)
+        }
+        return dist
+    }
+    
+    func quadCurve(to: CGPoint, control: CGPoint, x: CGFloat) -> CGFloat {
+        var dist: CGFloat = 0
+        let steps: CGFloat = 100
+        
+        for i in 0..<Int(steps) {
+            let t0 = CGFloat(i) / steps
+            let t1 = CGFloat(i+1) / steps
+            let a = point(to: to, t: t0, control: control)
+            let b = point(to: to, t: t1, control: control)
+            
+            if a.x >= x {
+                return dist
+            } else if b.x > x {
+                dist += a.line(to: b, x: x)
+                return dist
+            } else if b.x == x {
+                dist += a.line(to: b)
+                return dist
+            }
+            
+            dist += a.line(to: b)
+        }
+        return dist
+    }
+    
+    func point(to: CGPoint, t: CGFloat, control: CGPoint) -> CGPoint {
+        let x = CGPoint.value(x: self.x, y: to.x, t: t, c: control.x)
+        let y = CGPoint.value(x: self.y, y: to.y, t: t, c: control.y)
+        
+        return CGPoint(x: x, y: y)
+    }
+    
+    func curve(to: CGPoint, control1: CGPoint, control2: CGPoint) -> CGFloat {
+        var dist: CGFloat = 0
+        let steps: CGFloat = 100
+        
+        for i in 0..<Int(steps) {
+            let t0 = CGFloat(i) / steps
+            let t1 = CGFloat(i+1) / steps
+            
+            let a = point(to: to, t: t0, control1: control1, control2: control2)
+            let b = point(to: to, t: t1, control1: control1, control2: control2)
+            
+            dist += a.line(to: b)
+        }
+        
+        return dist
+    }
+    
+    func curve(to: CGPoint, control1: CGPoint, control2: CGPoint, x: CGFloat) -> CGFloat {
+        var dist: CGFloat = 0
+        let steps: CGFloat = 100
+        
+        for i in 0..<Int(steps) {
+            let t0 = CGFloat(i) / steps
+            let t1 = CGFloat(i+1) / steps
+            
+            let a = point(to: to, t: t0, control1: control1, control2: control2)
+            let b = point(to: to, t: t1, control1: control1, control2: control2)
+            
+            if a.x >= x {
+                return dist
+            } else if b.x > x {
+                dist += a.line(to: b, x: x)
+                return dist
+            } else if b.x == x {
+                dist += a.line(to: b)
+                return dist
+            }
+            
+            dist += a.line(to: b)
+        }
+        
+        return dist
+    }
+    
+    func point(to: CGPoint, t: CGFloat, control1: CGPoint, control2: CGPoint) -> CGPoint {
+        let x = CGPoint.value(x: self.x, y: to.x, t: t, c1: control1.x, c2: control2.x)
+        let y = CGPoint.value(x: self.y, y: to.y, t: t, c1: control1.y, c2: control2.x)
+        
+        return CGPoint(x: x, y: y)
+    }
+    
+    static func value(x: CGFloat, y: CGFloat, t: CGFloat, c: CGFloat) -> CGFloat {
+        var value: CGFloat = 0.0
+        // (1-t)^2 * p0 + 2 * (1-t) * t * c1 + t^2 * p1
+        value += pow(1-t, 2) * x
+        value += 2 * (1-t) * t * c
+        value += pow(t, 2) * y
+        return value
+    }
+    
+    static func value(x: CGFloat, y: CGFloat, t: CGFloat, c1: CGFloat, c2: CGFloat) -> CGFloat {
+        var value: CGFloat = 0.0
+        // (1-t)^3 * p0 + 3 * (1-t)^2 * t * c1 + 3 * (1-t) * t^2 * c2 + t^3 * p1
+        value += pow(1-t, 3) * x
+        value += 3 * pow(1-t, 2) * t * c1
+        value += 3 * (1-t) * pow(t, 2) * c2
+        value += pow(t, 3) * y
+        return value
+    }
+    
+    static func getMidPoint(point1: CGPoint, point2: CGPoint) -> CGPoint {
+        return CGPoint(
+            x: point1.x + (point2.x - point1.x) / 2,
+            y: point1.y + (point2.y - point1.y) / 2
+        )
+    }
+    
+    func dist(to: CGPoint) -> CGFloat {
+        return sqrt((pow(self.x - to.x, 2) + pow(self.y - to.y, 2)))
+    }
+    
+    static func midPointForPoints(p1:CGPoint, p2:CGPoint) -> CGPoint {
+        return CGPoint(x:(p1.x + p2.x) / 2,y: (p1.y + p2.y) / 2)
+    }
+    
+    static func controlPointForPoints(p1:CGPoint, p2:CGPoint) -> CGPoint {
+        var controlPoint = CGPoint.midPointForPoints(p1:p1, p2:p2)
+        let diffY = abs(p2.y - controlPoint.y)
+        
+        if (p1.y < p2.y){
+            controlPoint.y += diffY
+        } else if (p1.y > p2.y) {
+            controlPoint.y -= diffY
+        }
+        return controlPoint
+    }
+}
+

Sources/SwiftUICharts/PieChart/PieChartCell.swift

@@ -12,7 +12,7 @@ struct PieSlice: Identifiable {
     var id = UUID()
     var startDeg: Double
     var endDeg: Double
-    var value: Int
+    var value: Double
     var normalizedValue: Double
 }
 

Sources/SwiftUICharts/PieChart/PieChartRow.swift

@@ -9,7 +9,7 @@
 import SwiftUI
 
 public struct PieChartRow : View {
-    var data: [Int]
+    var data: [Double]
     var backgroundColor: Color
     var accentColor: Color
     var slices: [PieSlice] {

Sources/SwiftUICharts/PieChart/PieChartView.swift

@@ -9,15 +9,20 @@
 import SwiftUI
 
 public struct PieChartView : View {
-    public var data: [Int]
+    public var data: [Double]
     public var title: String
     public var legend: String?
     public var style: ChartStyle
-    public init(data: [Int], title: String, legend: String? = nil, style: ChartStyle = Styles.pieChartStyleOne ){
+    public var formSize:CGSize
+    public var dropShadow: Bool
+
+    public init(data: [Double], title: String, legend: String? = nil, style: ChartStyle = Styles.pieChartStyleOne, form: CGSize? = ChartForm.medium, dropShadow: Bool? = true){
         self.data = data
         self.title = title
         self.legend = legend
         self.style = style
+        self.formSize = form!
+        self.dropShadow = dropShadow!
     }
     
     public var body: some View {
@@ -25,7 +30,7 @@ public struct PieChartView : View {
             Rectangle()
                 .fill(self.style.backgroundColor)
                 .cornerRadius(20)
-                .shadow(color: Color.gray, radius: 12)
+                .shadow(color: self.style.dropShadowColor, radius: self.dropShadow ? 12 : 0)
             VStack(alignment: .leading){
                 HStack{
                     Text(self.title)
@@ -46,7 +51,7 @@ public struct PieChartView : View {
                 }
                 
             }
-        }.frame(width: self.style.chartFormSize.width, height: self.style.chartFormSize.height)
+        }.frame(width: self.formSize.width, height: self.formSize.height)
     }
 }