스트리밍은 대부분의 브라우저와
Developer 앱에서 사용할 수 있습니다.
-
Swift Charts: 벡터화된 플롯과 함수 플롯
플롯의 반전! 함수와 벡터화된 플롯을 사용하여 앱에서 수학적 함수와 대규모 데이터세트를 근사하게 표현하도록 차트를 렌터링하는 방법을 알아보세요. Swift Charts는 기체 역학, 자기, 고차장론에서 일반적으로 사용되는 함수를 표시하는 것은 물론 대형 대화식 열 지도도 구현할 수 있습니다.
챕터
- 0:00 - Introduction
- 1:01 - Function plots
- 6:48 - Vectorized plots
- 11:27 - Best practices
리소스
관련 비디오
WWDC23
WWDC22
-
다운로드Array
-
-
1:43 - Histogram that shows distribution of capacity density
Chart { ForEach(bins) { bin in BarMark( x: .value("Capacity density", bin.range), y: .value("Probability", bin.probability) ) } }
-
2:18 - Visualize function with LinePlot
Chart { LinePlot( x: "Capacity density", y: "Probability" ) { x in // (Double) -> Double normalDistribution( x, mean: mean, standardDeviation: standardDeviation ) } }
-
3:36 - Customize function plot with modifiers
Chart { LinePlot( x: "Capacity density", y: "Probability" ) { x in normalDistribution(x, ...) } .foregroundStyle(.gray }
-
3:57 - Visualize area under a curve with AreaPlot
Chart { AreaPlot( x: "Capacity density", y: "Probability" ) { x in normalDistribution(x, ...) } .foregroundStyle(.gray) .opacity(0.2) }
-
4:21 - Visualize area between curves with AreaPlot
Chart { AreaPlot( x: "x", yStart: "cos(x)", yEnd: "sin(x)" ) { x in (yStart: cos(x / 180 * .pi), yEnd: sin(x / 180 * .pi)) } }
-
4:59 - Specify domain for function plots
Chart { AreaPlot( x: "x", yStart: "cos(x)", yEnd: "sin(x)" ) { x in (yStart: cos(x / 180 * .pi), yEnd: sin(x / 180 * .pi)) } } .chartXScale(domain: -315...225) .chartYScale(domain: -5...5)
-
5:18 - Specify sampling domain for function plots
Chart { AreaPlot( x: "x", yStart: "cos(x)", yEnd: "sin(x)", domain: -135...45 ) { x in (yStart: cos(x / 180 * .pi), yEnd: sin(x / 180 * .pi)) } } .chartXScale(domain: -315...225) .chartYScale(domain: -5...5)
-
5:55 - Visualize parametric functions
Chart { LinePlot( x: "x", y: "y", t: "t", domain: -.pi ... .pi ) { t in let x = sqrt(2) * pow(sin(t), 3) let y = cos(t) * (2 - cos(t) - pow(cos(t), 2)) return (x, y) } } .chartXScale(domain: -3...3) .chartYScale(domain: -4...2)
-
6:40 - Use Double.nan to represent no value
Chart { LinePlot(x: "x", y: "1 / x") { x in guard x != 0 else { return .nan } return 1 / x } } .chartXScale(domain: -10...10) .chartYScale(domain: -10...10)
-
7:43 - Highly customized Chart
Chart { ForEach(model.data) { if $0.capacityDensity > 0.0001 { RectangleMark( x: .value("Longitude", $0.x), y: .value("Latitude", $0.y) ) .foregroundStyle(by: .value("Axis type", $0.axisType)) } else { PointMark( x: .value("Longitude", $0.x), y: .value("Latitude", $0.y) ) .opacity(0.5) } } }
-
8:00 - Homogeneously styled Chart
Chart { ForEach(model.data) { RectangleMark( x: .value("Longitude", $0.x), y: .value("Latitude", $0.y) ) .foregroundStyle(by: .value("Axis type", $0.panelAxisType)) .opacity($0.capacityDensity) } }
-
8:23 - Vectorized plot for homogeneously styled chart
Chart { RectanglePlot( model.data, x: .value("Longitude", \.x), y: .value("Latitude", \.y) ) .foregroundStyle(by: .value("Axis type", \.panelAxisType)) .opacity(\.capacityDensity) }
-
9:42 - Vectorized point plot API
Chart { PointPlot( model.data, x: .value("Longitude", \.x), y: .value("Latitude", \.y) ) }
-
10:26 - Vectorized plot modifiers
Chart { PointPlot( model.data, x: .value("Longitude", \.x), y: .value("Latitude", \.y) ) .symbolSize(by: .value("Capacity", \.capacity)) .foregroundStyle( by: .value("Axis type", \.panelAxisType) ) }
-
-
찾고 계신 콘텐츠가 있나요? 위에 주제를 입력하고 원하는 내용을 바로 검색해 보세요.
쿼리를 제출하는 중에 오류가 발생했습니다. 인터넷 연결을 확인하고 다시 시도해 주세요.