Skip to content

Commit 6cdef24

Browse files
ay42ay42
authored
Playgrounds (#13)
* playgrounds * cleanup * playground
1 parent 3f74ad6 commit 6cdef24

File tree

3 files changed

+166
-0
lines changed

3 files changed

+166
-0
lines changed

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,4 @@
33
/Packages
44
/*.xcodeproj
55
xcuserdata/
6+
.swiftpm/

‎Playgrounds/Charts.playground/Contents.swift‎

Lines changed: 161 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,161 @@
1+
//: Examples in Playground form for Xcode 12+
2+
import SwiftUI
3+
import Charts
4+
import Shapes
5+
6+
import PlaygroundSupport
7+
8+
struct ContentView: View {
9+
@State var data1: [CGFloat] = (2010...2020).map { _ in .random(in: 0.1...1.0) }
10+
@State var data2: [CGFloat] = (0..<50).map { _ in .random(in: 0.1...1.0) }
11+
@State var data3: [CGFloat] = (0..<100).map { _ in .random(in: 0.1...1.0) }
12+
13+
@State var data4: [CGFloat] = (0..<100).map { _ in .random(in: 0.4...1.0) }
14+
@State var data5: [CGFloat] = (0..<100).map { _ in .random(in: 0.1...0.3) }
15+
@State var data6: [CGFloat] = (0..<100).map { _ in .random(in: 0.3...0.4) }
16+
17+
@State var matrixData1: [[CGFloat]] = (0..<20).map { _ in (0..<3).map { _ in CGFloat.random(in: 0.00...0.33) } }
18+
19+
var chart1: some View {
20+
HStack {
21+
VStack {
22+
AxisLabels(.vertical, data: 1...10, id: \.self) {
23+
Text("\(110 - $0 * 10)")
24+
.fontWeight(.bold)
25+
.font(Font.system(size: 8))
26+
.foregroundColor(.secondary)
27+
}
28+
.frame(width: 20)
29+
30+
Rectangle().foregroundColor(.clear).frame(width: 20, height: 20)
31+
}
32+
33+
34+
VStack {
35+
Chart(data: data1)
36+
.chartStyle(
37+
LineChartStyle(.quadCurve, lineColor: .blue, lineWidth: 5)
38+
)
39+
.padding()
40+
.background(
41+
GridPattern(horizontalLines: 10 + 1, verticalLines: data1.count + 1)
42+
.inset(by: 1)
43+
.stroke(Color.gray.opacity(0.1), style: .init(lineWidth: 2, lineCap: .round))
44+
)
45+
.frame(height: 300)
46+
47+
48+
AxisLabels(.horizontal, data: 2010...2020, id: \.self) {
49+
Text("\($0)".replacingOccurrences(of: ",", with: ""))
50+
.fontWeight(.bold)
51+
.font(Font.system(size: 8))
52+
.foregroundColor(.secondary)
53+
}
54+
.frame(height: 20)
55+
.padding(.horizontal, 1)
56+
}
57+
.layoutPriority(1)
58+
}
59+
60+
.padding()
61+
}
62+
var chart2: some View {
63+
Chart(data: data2)
64+
.chartStyle(
65+
AreaChartStyle(.quadCurve, fill:
66+
LinearGradient(gradient: .init(colors: [Color.red.opacity(0.8), Color.red.opacity(0.2)]), startPoint: .top, endPoint: .bottom)
67+
)
68+
)
69+
.background(
70+
Color.gray.opacity(0.1)
71+
.overlay(
72+
GridPattern(horizontalLines: data2.count)
73+
.inset(by: 1)
74+
.stroke(Color.red.opacity(0.2), style: .init(lineWidth: 1, lineCap: .round))
75+
)
76+
)
77+
.cornerRadius(16)
78+
.frame(height: 300)
79+
.padding()
80+
}
81+
var chart3: some View {
82+
Chart(data: data3)
83+
.chartStyle(
84+
ColumnChartStyle(column: Capsule().foregroundColor(.green), spacing: 2)
85+
)
86+
.padding()
87+
.background(Color.gray.opacity(0.1))
88+
.cornerRadius(16)
89+
.frame(height: 300)
90+
.padding()
91+
}
92+
var chart4: some View {
93+
Chart(data: matrixData1)
94+
.chartStyle(
95+
StackedAreaChartStyle(.quadCurve, colors: [.yellow, .orange, .red])
96+
)
97+
.background(
98+
Color.gray.opacity(0.1)
99+
.overlay(
100+
GridPattern(horizontalLines: data2.count)
101+
.inset(by: 1)
102+
.stroke(Color.red.opacity(0.2), style: .init(lineWidth: 1, lineCap: .round))
103+
)
104+
)
105+
.cornerRadius(16)
106+
.frame(height: 300)
107+
.padding()
108+
}
109+
var chart5: some View {
110+
ZStack {
111+
Chart(data: data4)
112+
.chartStyle(
113+
LineChartStyle(.quadCurve, lineColor: .purple, lineWidth: 3)
114+
)
115+
116+
Chart(data: data4)
117+
.chartStyle(
118+
AreaChartStyle(.quadCurve, fill:
119+
LinearGradient(gradient: .init(colors: [Color.purple.opacity(0.8), Color.purple.opacity(0.2)]), startPoint: .top, endPoint: .bottom)
120+
)
121+
)
122+
123+
Chart(data: data5)
124+
.chartStyle(
125+
ColumnChartStyle(column: Color.white.opacity(0.5), spacing: 2)
126+
)
127+
128+
Chart(data: data6)
129+
.chartStyle(
130+
LineChartStyle(.line, lineColor: Color.white.opacity(0.2), lineWidth: 3)
131+
)
132+
}.padding()
133+
.background(Color.gray.opacity(0.1))
134+
.cornerRadius(16)
135+
.frame(height: 300)
136+
.padding()
137+
}
138+
139+
@State var selectedChart = 1
140+
var body: some View {
141+
VStack {
142+
Picker("Charts", selection: $selectedChart) {
143+
Text("Line").tag(1)
144+
Text("Area").tag(2)
145+
Text("Column").tag(3)
146+
Text("Stacked Area").tag(4)
147+
Text("ZStacked").tag(5)
148+
}.pickerStyle(SegmentedPickerStyle()).padding()
149+
150+
ZStack {
151+
if selectedChart == 1 { chart1 }
152+
if selectedChart == 2 { chart2 }
153+
if selectedChart == 3 { chart3 }
154+
if selectedChart == 4 { chart4 }
155+
if selectedChart == 5 { chart5 }
156+
}
157+
}.frame(width: 700)
158+
}
159+
}
160+
161+
PlaygroundPage.current.setLiveView(ContentView())

‎Playgrounds/Charts.playground/contents.xcplayground‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
2+
<playground version='5.0' target-platform='macos' buildActiveScheme='true'>
3+
<timeline fileName='timeline.xctimeline'/>
4+
</playground>

0 commit comments

Comments
 (0)