SwiftUICharts
v2.10.3
مخططات / مكتبة تخطيط لسويفتوي. يعمل على MacOS و iOS و Watchos و TVOS ولديه ميزات الوصول والتوطين المضمنة.
مشروع التجريبي
الوثائق
العمل على الإصدار 3 مع شعور أكثر سويفوي في واجهة برمجة التطبيقات.
مخطط خط
مخطط الخط المملوء
الرسم البياني متعدد الخط
مخطط خط Ranged
مخطط بار
رسم تخطيطي بار
مخطط شريط مجمعة
مخطط شريط مكدسة
مخطط فطيرة
الرسم البياني دونات
يستخدم نموذج بيانات LineChartData .
LineChart ( chartData : LineChartData ) 
يستخدم نموذج بيانات LineChartData .
FilledLineChart ( chartData : LineChartData ) 
يستخدم نموذج بيانات MultiLineChartData .
MultiLineChart ( chartData : MultiLineChartData ) 
يستخدم نموذج بيانات RangedLineChart .
RangedLineChart ( chartData : RangedLineChartData )
يستخدم نموذج بيانات BarChartData .
BarChart ( chartData : BarChartData ) 
يستخدم نموذج بيانات RangedBarChartData .
RangedBarChart ( chartData : RangedBarChartData ) 
يستخدم نموذج بيانات GroupedBarChartData .
GroupedBarChart ( chartData : GroupedBarChartData ) 
يستخدم نموذج بيانات StackedBarChartData .
StackedBarChart ( chartData : StackedBarChartData )
يستخدم نموذج بيانات PieChartData .
PieChart ( chartData : PieChartData ) 
يستخدم نموذج بيانات DoughnutChartData .
DoughnutChart ( chartData : DoughnutChartData ) مدير الحزمة السريع
File > Swift Packages > Add Package Dependency...
import SwiftUICharts إذا كنت تواجه مشكلة في عدم التحديث بشكل صحيح ، فأضف .id() إلى عرضك.
LineChart ( chartData : LineChartData )
. id ( LineChartData . id ) لمس التراكب
مربع المعلومات
مربع المعلومات العائمة
صندوق الرأس
الأساطير
متوسط الخط
y المحور نقطة الاهتمام
x شبكة المحور
Y محور الشبكة
س ملصقات المحور
ملصقات محور ص
خط الاتجاه الخطي
علامات النقطة
إن ترتيب المعدلات في العرض هو بعض ما هو مهم لأن المعدلات هي أنواع مختلفة من المداخن التي تلتقط حول طرق العرض السابقة.
يكتشف الإدخال إما من لمسة المؤشر. يجد أقرب نقطة بيانات ويعرض المعلومات ذات الصلة عند تحديدها.
تم تعيين موقع مربع المعلومات في ChartStyle -> infoBoxPlacement .
. touchOverlay ( chartData : CTChartData , specifier : String , unit : TouchUnit )الإعداد ضمن بيانات المخطط -> نمط المخطط
يعرض المعلومات من Touch Overlay إذا تم تعيين InfoBoxPlacement على .infoBox .
تم تعيين موقع مربع المعلومات في ChartStyle -> infoBoxPlacement .
. infoBox ( chartData : CTChartData ) يعرض المعلومات من Touch Overlay إذا تم ضبط InfoBoxPlacement على .floating .
تم تعيين موقع مربع المعلومات في ChartStyle -> infoBoxPlacement .
. floatingInfoBox ( chartData : CTChartData ) يعرض البيانات الوصفية حول الرسم البياني ، الذي تم تعيينه في Chart Data -> ChartMetadata
يعرض المعلومات من Touch Overlay إذا تم تعيين InfoBoxPlacement على .header .
تم تعيين موقع مربع المعلومات في ChartStyle -> infoBoxPlacement .
. headerBox ( chartData : CTChartData ) يعرض الأساطير.
. legends ( )يضع علامات على كل نقطة من نقطة البيانات.
يعرض خط علامة في متوسط جميع نقاط البيانات.
. averageLine ( chartData : CTLineBarChartDataProtocol ,
markerName : " Average " ,
labelPosition : . yAxis ( specifier : " %.0f " ) ,
lineColour : . primary ,
strokeStyle : StrokeStyle ( lineWidth : 3 , dash : [ 5 , 10 ] ) )نقطة الاهتمام القابلة للتكوين
. yAxisPOI ( chartData : CTLineBarChartDataProtocol ,
markerName : " Marker " ,
markerValue : 123 ,
labelPosition : . center ( specifier : " %.0f " ) ,
labelColour : Color . black ,
labelBackground : Color . orange ,
lineColour : Color . orange ,
strokeStyle : StrokeStyle ( lineWidth : 3 , dash : [ 5 , 10 ] ) )يضيف خطوط عمودية على طول المحور x.
. xAxisGrid ( chartData : CTLineBarChartDataProtocol ) الإعداد داخل ChartData -> ChartStyle .
يضيف خطوط أفقية على طول المحور ص.
. yAxisGrid ( chartData : CTLineBarChartDataProtocol ) الإعداد داخل ChartData -> ChartStyle .
تسميات للمحور x.
. xAxisLabels ( chartData : CTLineBarChartDataProtocol ) الإعداد داخل ChartData -> ChartStyle .
تسميات تم إنشاؤها تلقائيًا لمحور Y.
. yAxisLabels ( chartData : CTLineBarChartDataProtocol , specifier : " %.0f " ) الإعداد داخل ChartData -> ChartStyle .
Yaxislabeltype:
case numeric // Auto generated, numeric labels.
case custom // Custom labels array تم تعيين العرف من ChartData -> yAxisLabels
خط عبر المخطط لإظهار الاتجاه في البيانات.
. linearTrendLine ( chartData : CTLineBarChartDataProtocol ,
firstValue : Double ,
lastValue : Double ,
lineColour : ColourStyle ,
strokeStyle : StrokeStyle )يضع علامات على كل نقطة من نقطة البيانات.
. pointMarkers ( chartData : CTLineChartDataProtocol ) الإعداد داخل Data Set -> PointStyle .
يضيف خطًا مستقلًا على قمة LovalLinechart.
. filledTopLine ( chartData : LineChartData ,
lineColour : ColourStyle ,
strokeStyle : StrokeStyle )يسمح بخط صلب فوق نقطة البيانات مع ملء شبه شفط.
struct LineChartDemoView : View {
let data : LineChartData = weekOfData ( )
var body : some View {
VStack {
LineChart ( chartData : data )
. pointMarkers ( chartData : data )
. touchOverlay ( chartData : data , specifier : " %.0f " )
. yAxisPOI ( chartData : data ,
markerName : " Step Count Aim " ,
markerValue : 15_000 ,
labelPosition : . center ( specifier : " %.0f " ) ,
labelColour : Color . black ,
labelBackground : Color ( red : 1.0 , green : 0.75 , blue : 0.25 ) ,
lineColour : Color ( red : 1.0 , green : 0.75 , blue : 0.25 ) ,
strokeStyle : StrokeStyle ( lineWidth : 3 , dash : [ 5 , 10 ] ) )
. yAxisPOI ( chartData : data ,
markerName : " Minimum Recommended " ,
markerValue : 10_000 ,
labelPosition : . center ( specifier : " %.0f " ) ,
labelColour : Color . white ,
labelBackground : Color ( red : 0.25 , green : 0.75 , blue : 1.0 ) ,
lineColour : Color ( red : 0.25 , green : 0.75 , blue : 1.0 ) ,
strokeStyle : StrokeStyle ( lineWidth : 3 , dash : [ 5 , 10 ] ) )
. averageLine ( chartData : data ,
strokeStyle : StrokeStyle ( lineWidth : 3 , dash : [ 5 , 10 ] ) )
. xAxisGrid ( chartData : data )
. yAxisGrid ( chartData : data )
. xAxisLabels ( chartData : data )
. yAxisLabels ( chartData : data )
. infoBox ( chartData : data )
. headerBox ( chartData : data )
. legends ( chartData : data , columns : [ GridItem ( . flexible ( ) ) , GridItem ( . flexible ( ) ) ] )
. id ( data . id )
. frame ( minWidth : 150 , maxWidth : 900 , minHeight : 150 , idealHeight : 250 , maxHeight : 400 , alignment : . center )
}
. navigationTitle ( " Week of Data " )
}
static func weekOfData ( ) -> LineChartData {
let data = LineDataSet ( dataPoints : [
LineChartDataPoint ( value : 12000 , xAxisLabel : " M " , description : " Monday " ) ,
LineChartDataPoint ( value : 10000 , xAxisLabel : " T " , description : " Tuesday " ) ,
LineChartDataPoint ( value : 8000 , xAxisLabel : " W " , description : " Wednesday " ) ,
LineChartDataPoint ( value : 17500 , xAxisLabel : " T " , description : " Thursday " ) ,
LineChartDataPoint ( value : 16000 , xAxisLabel : " F " , description : " Friday " ) ,
LineChartDataPoint ( value : 11000 , xAxisLabel : " S " , description : " Saturday " ) ,
LineChartDataPoint ( value : 9000 , xAxisLabel : " S " , description : " Sunday " )
] ,
legendTitle : " Steps " ,
pointStyle : PointStyle ( ) ,
style : LineStyle ( lineColour : ColourStyle ( colour : . red ) , lineType : . curvedLine ) )
let metadata = ChartMetadata ( title : " Step Count " , subtitle : " Over a Week " )
let gridStyle = GridStyle ( numberOfLines : 7 ,
lineColour : Color ( . lightGray ) . opacity ( 0.5 ) ,
lineWidth : 1 ,
dash : [ 8 ] ,
dashPhase : 0 )
let chartStyle = LineChartStyle ( infoBoxPlacement : . infoBox ( isStatic : false ) ,
infoBoxBorderColour : Color . primary ,
infoBoxBorderStyle : StrokeStyle ( lineWidth : 1 ) ,
markerType : . vertical ( attachment : . line ( dot : . style ( DotStyle ( ) ) ) ) ,
xAxisGridStyle : gridStyle ,
xAxisLabelPosition : . bottom ,
xAxisLabelColour : Color . primary ,
xAxisLabelsFrom : . dataPoint ( rotation : . degrees ( 0 ) ) ,
yAxisGridStyle : gridStyle ,
yAxisLabelPosition : . leading ,
yAxisLabelColour : Color . primary ,
yAxisNumberOfLabels : 7 ,
baseline : . minimumWithMaximum ( of : 5000 ) ,
topLine : . maximum ( of : 20000 ) ,
globalAnimation : . easeOut ( duration : 1 ) )
return LineChartData ( dataSets : data ,
metadata : metadata ,
chartStyle : chartStyle )
}
}داخل عناصر معينة ، توجد علامات إضافية للمساعدة في وصف الرسم البياني الخاص بالتعليق الصوتي.
انظر توطين إمكانية الوصول
جميع الملصقات تدعم توطين. ومع ذلك ، هناك بعض الملصقات الخفية الموجودة لدعم التعليق الصوتي. انظر توطين إمكانية الوصول
شاهد توطين التوطين في مشروع العرض التجريبي.
صوت Over وصف نقطة بيانات عندما يلمس المستخدم المنطقة الأقرب إلى نقطة البيانات. سيقول الصوتي <chart title>, <data point value>, <data point description> .
" %@ <local_description_of_a_data_point> " = " %@, <Description of a data point> " ; اقرأ أمام poiMarker . سيقول الصوتي <poi marker>, <marker legend title>, <marker value> .
" P-O-I-Marker " = " P O I Marker " ;
" Average " = " Average " ; صوت على وصف poiMarker . سيقول الصوتي <POI-Marker>, <marker legend title>, <marker value> .
" <local_marker_legend_title> %@ " = " local_marker_legend_title, %@ " ; اقرأ قبل axisLabel . سيقول التعليق الصوتي <axisLabel>, <marker value> .
"X-Axis-Label" = "X Axis Label";
"Y-Axis-Label" = "Y Axis Label";
اقرأ قبل legend . سيقول التعليق الصوتي <chart type legend>, <legend title> .
" Line-Chart-Legend " = " Line Chart Legend " ;
" P-O-I-Marker-Legend " = " P O I Marker Legend " ;
" Bar-Chart-Legend " = " Bar Chart Legend " ;
" P-O-I-Marker-Legend " = " P O I Marker Legend " ;
" Pie-Chart-Legend " = " Pie Chart Legend " ;
" P-O-I-Marker-Legend " = " P O I Marker Legend " ;
