Merge pull request #52 from willdale/fix-xaxislabel-rotation

Fix xAxisLabels rotation when using .chartData().
willdale · Apr 15, 2021 · 80fe2e7 · 80fe2e7
2 parents f33ac1b + 44cf4e7
commit 80fe2e7
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 20 deletions.
diff --git a/Sources/SwiftUICharts/LineChart/Models/ChartData/LineChartData.swift b/Sources/SwiftUICharts/LineChart/Models/ChartData/LineChartData.swift
@@ -81,11 +81,11 @@ public final class LineChartData: CTLineChartDataProtocol {
                 }
                 .padding(.horizontal, -4)
 
-            case .chartData:
+            case .chartData(let angle):
                 if let labelArray = self.xAxisLabels {
                     HStack(spacing: 0) {
                         ForEach(labelArray.indices, id: \.self) { [unowned self] i in
-                            XAxisChartDataCell(chartData: self, label: labelArray[i])
+                            XAxisChartDataCell(chartData: self, label: labelArray[i], rotationAngle: angle)
                                 .foregroundColor(self.chartStyle.xAxisLabelColour)
                                 .accessibilityLabel(Text("X Axis Label"))
                                 .accessibilityValue(Text("\(labelArray[i])"))
@@ -95,7 +95,6 @@ public final class LineChartData: CTLineChartDataProtocol {
                             }
                         }
                     }
-                    .padding(.horizontal, -4)
                 }
             }
         }

diff --git a/Sources/SwiftUICharts/LineChart/Models/ChartData/MultiLineChartData.swift b/Sources/SwiftUICharts/LineChart/Models/ChartData/MultiLineChartData.swift
@@ -78,11 +78,11 @@ public final class MultiLineChartData: CTLineChartDataProtocol {
                 }
                 .padding(.horizontal, -4)
 
-            case .chartData:
+            case .chartData(let angle):
                 if let labelArray = self.xAxisLabels {
                     HStack(spacing: 0) {
                         ForEach(labelArray.indices, id: \.self) { [unowned self] i in
-                            XAxisChartDataCell(chartData: self, label: labelArray[i])
+                            XAxisChartDataCell(chartData: self, label: labelArray[i], rotationAngle: angle)
                                 .foregroundColor(self.chartStyle.xAxisLabelColour)
                                 .accessibilityLabel(Text("X Axis Label"))
                                 .accessibilityValue(Text("\(labelArray[i])"))
@@ -92,7 +92,6 @@ public final class MultiLineChartData: CTLineChartDataProtocol {
                             }
                         }
                     }
-                    .padding(.horizontal, -4)
                 }
             }
         }

diff --git a/Sources/SwiftUICharts/LineChart/Models/ChartData/RangedLineChartData.swift b/Sources/SwiftUICharts/LineChart/Models/ChartData/RangedLineChartData.swift
@@ -85,11 +85,11 @@ public final class RangedLineChartData: CTLineChartDataProtocol {
                 }
                 .padding(.horizontal, -4)
 
-            case .chartData:
+            case .chartData(let angle):
                 if let labelArray = self.xAxisLabels {
                     HStack(spacing: 0) {
                         ForEach(labelArray.indices, id: \.self) { [unowned self] i in
-                            XAxisChartDataCell(chartData: self, label: labelArray[i])
+                            XAxisChartDataCell(chartData: self, label: labelArray[i], rotationAngle: angle)
                                 .foregroundColor(self.chartStyle.xAxisLabelColour)
                                 .accessibilityLabel(Text("X Axis Label"))
                                 .accessibilityValue(Text("\(labelArray[i])"))
@@ -99,7 +99,6 @@ public final class RangedLineChartData: CTLineChartDataProtocol {
                             }
                         }
                     }
-                    .padding(.horizontal, -4)
                 }
             }
         }

diff --git a/Sources/SwiftUICharts/SharedLineAndBar/Views/ YAxisLabelCell.swift b/Sources/SwiftUICharts/SharedLineAndBar/Views/ YAxisLabelCell.swift
@@ -9,10 +9,10 @@ import SwiftUI
 
 internal struct XAxisDataPointCell<ChartData>: View where ChartData: CTLineBarChartDataProtocol {
 
-    @ObservedObject var chartData : ChartData
+    @ObservedObject var chartData: ChartData
 
-    private let label : String
-    private let rotationAngle : Angle
+    private let label: String
+    private let rotationAngle: Angle
 
     internal init(chartData: ChartData, label: String, rotationAngle : Angle) {
         self.chartData     = chartData
@@ -41,22 +41,23 @@ internal struct XAxisDataPointCell<ChartData>: View where ChartData: CTLineBarCh
             .onAppear {
                 chartData.viewData.xAxisLabelHeights.append(width)
             }
-
     }
 }
 
 internal struct XAxisChartDataCell<ChartData>: View where ChartData: CTLineBarChartDataProtocol {
 
-    @ObservedObject var chartData : ChartData
+    @ObservedObject var chartData: ChartData
 
-    private let label : String
+    private let label: String
+    private let rotationAngle: Angle
 
-    internal init(chartData: ChartData, label: String) {
+    internal init(chartData: ChartData, label: String, rotationAngle : Angle) {
         self.chartData     = chartData
         self.label         = label
+        self.rotationAngle = rotationAngle
     }
 
-    @State private var height: CGFloat = 0
+    @State private var width: CGFloat = 0
 
     internal var body: some View {
 
@@ -67,15 +68,16 @@ internal struct XAxisChartDataCell<ChartData>: View where ChartData: CTLineBarCh
                 GeometryReader { geo in
                     Color.clear
                         .onAppear {
-                            self.height = geo.frame(in: .local).height
+                            self.width = geo.frame(in: .local).width
                         }
                 }
             )
             .fixedSize(horizontal: true, vertical: false)
+            .rotationEffect(rotationAngle, anchor: .center)
+            .frame(height: width, alignment: .top)
             .onAppear {
-                chartData.viewData.xAxisLabelHeights.append(height)
+                chartData.viewData.xAxisLabelHeights.append(width)
             }
-
     }
 }