Mercurial > public > stock-charts

annotate InteractiveCharts/LineChart/Helpers/LineView.swift @ 8:959175ee5ebd

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Implement interaction with ChartView
author Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
date Mon, 26 Apr 2021 23:06:42 +0200
parents f828c7c408d4
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
5
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
1 //
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
2 // LineView.swift
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
3 // InteractiveCharts
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
4 //
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
5 // Created by Dennis Concepción Martín on 26/4/21.
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
6 //
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
7
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
8 import SwiftUI
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
9
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
10 struct LineView: View {
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
11 var data: [Double]
8
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
12 var dates: [String]?
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
13 var hours: [String]?
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
14
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
15 @Binding var showingIndicators: Bool
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
16 @Binding var indexPosition: Int
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
17 @State private var IndicatorPointPosition: CGPoint = .zero
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
18 @State private var pathPoints = [CGPoint]()
5
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
19
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
20 var body: some View {
8
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
21 ZStack {
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
22 GeometryReader { proxy in
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
23 LinePath(data: data, width: proxy.size.width, height: proxy.size.height, pathPoints: $pathPoints)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
24 .stroke(colorLine(), lineWidth: 2)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
25 }
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
26
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
27 if showingIndicators {
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
28 IndicatorPoint()
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
29 .position(x: IndicatorPointPosition.x, y: IndicatorPointPosition.y)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
30 }
5
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
31 }
8
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
32 .rotationEffect(.degrees(180), anchor: .center)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
33 .rotation3DEffect(.degrees(180), axis: (x: 0.0, y: 1.0, z: 0.0))
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
34 .contentShape(Rectangle()) // Control tappable area
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
35 .gesture(
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
36 LongPressGesture(minimumDuration: 0.2)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
37 .sequenced(before: DragGesture(minimumDistance: 0, coordinateSpace: .local))
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
38 .onChanged({ value in // Get value of the gesture
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
39 switch value {
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
40 case .second(true, let drag):
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
41 if let longPressLocation = drag?.location {
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
42 dragGesture(longPressLocation)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
43 }
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
44 default:
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
45 break
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
46 }
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
47 })
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
48 // Hide indicator when finish
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
49 .onEnded({ value in
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
50 self.showingIndicators = false
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
51 })
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
52 )
5
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
53 }
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
54
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
55 /*
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
56 Color path depending on data.
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
57 */
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
58 private func colorLine() -> Color {
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
59 var color = Color(.systemGreen)
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
60
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
61 if data.first! > data.last! {
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
62 color = Color(.systemRed)
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
63 } else if data.first! == data.last! {
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
64 color = Color(.systemTeal)
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
65 }
8
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
66 else if showingIndicators {
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
67 color = Color(.systemBlue)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
68 }
5
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
69
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
70 return color
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
71 }
8
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
72
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
73 /*
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
74 When the user drag on Path -> Modifiy indicator point to move it on the path accordingly
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
75 */
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
76 private func dragGesture(_ longPressLocation: CGPoint) {
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
77 let (closestXPoint, closestYPoint, yPointIndex) = getClosestValueFrom(longPressLocation, inData: pathPoints)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
78 self.IndicatorPointPosition.x = closestXPoint
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
79 self.IndicatorPointPosition.y = closestYPoint
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
80 self.showingIndicators = true
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
81 self.indexPosition = yPointIndex
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
82 }
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
83
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
84 /*
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
85 First, search the closest X point in Path from the tapped location.
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
86 Then, find the correspondent Y point in Path.
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
87 */
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
88 private func getClosestValueFrom(_ value: CGPoint, inData: [CGPoint]) -> (CGFloat, CGFloat, Int) {
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
89 let touchPoint: (CGFloat, CGFloat) = (value.x, value.y)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
90 let xPathPoints = inData.map { $0.x }
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
91 let yPathPoints = inData.map { $0.y }
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
92
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
93 // Closest X value
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
94 let closestXPoint = xPathPoints.enumerated().min( by: { abs($0.1 - touchPoint.0) < abs($1.1 - touchPoint.0) } )!
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
95 let closestYPointIndex = xPathPoints.firstIndex(of: closestXPoint.element)!
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
96 let closestYPoint = yPathPoints[closestYPointIndex]
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
97
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
98 // Index of the closest points in the array
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
99 let yPointIndex = yPathPoints.firstIndex(of: closestYPoint)!
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
100
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
101 return (closestXPoint.element, closestYPoint, yPointIndex)
959175ee5ebd Implement interaction with ChartView
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents: 5
diff changeset
102 }
5
f828c7c408d4 Add source code
Dennis Concepción Martín <66180929+denniscm190@users.noreply.github.com>
parents:
diff changeset
103 }