SwiftUICharts

用于轻松显示图表的 Swift 包。

V2 专注于提供一个强大且易于使用的基础，您可以在此基础上构建精美的自定义图表。它提供基本的构建块，例如图表视图（条形图、饼图、折线图和环形图）、网格视图、卡片视图、用于显示当前图表值的交互式标签。您可以决定是构建一个功能齐全的交互式视图，还是仅显示一个基本的图表。

• 如何安装 SwiftUI ChartView

• 如何创建您的第一个图表

它支持

• 折线图
• 条形图
• 饼图

加入我们的 Slack 频道进行日常对话和更深入的了解

Slack 邀请链接

它需要 iOS 13 和 Xcode 11！

在 Xcode 中，转到 File -> Swift Packages -> Add Package Dependency 并粘贴仓库的 URL：https://github.com/AppPear/ChartView

在您想要使用的文件中导入该包：import SwiftUICharts

您可以通过将图表视图添加到父视图来显示图表

添加了一个示例项目，带有 iOS, watchOS 目标：https://github.com/AppPear/ChartViewDemo

具有多条线的 LineChartView！ 此功能的首次发布，目前已禁用交互，我将研究如何最好地通过单次触摸与多条线进行交互。

用法

MultiLineChartView(data: [([8,32,11,23,40,28], GradientColors.green), ([90,99,78,111,70,60,77], GradientColors.purple), ([34,56,72,38,43,100,50], GradientColors.orngPink)], title: "Title")

渐变色现在位于 GradientColor 结构下，您可以通过 GradientColor(start: Color, end: Color) 创建自己的渐变

可用的预设渐变

• 橙色
• 蓝色
• 绿色
• 蓝色
• 蓝紫色
• 紫色
• 紫粉色
• 紫霓虹
• 橙粉色

名为 LineView 的全屏视图！！！

 LineView(data: [8,23,54,32,12,37,7,23,43], title: "Line chart", legend: "Full screen") // legend is optional, use optional .padding()

自动适应暗黑模式

您可以通过指定添加自定义暗黑模式样式

let myCustomStyle = ChartStyle(...)
let myCutsomDarkModeStyle = ChartStyle(...)
myCustomStyle.darkModeStyle = myCutsomDarkModeStyle

折线图是交互式的，因此您可以拖动以显示数据点

您可以使用以下代码添加折线图

 LineChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", legend: "Legendary") // legend is optional

通过添加到 Initialiser 来关闭阴影：dropShadow: false

[新功能] 您还可以沿着每个条的值和点显示标签，以更好地描述您的数据！ 条形图是交互式的，因此您可以拖动以显示数据点

您可以使用以下代码添加条形图

标签和点

 BarChartView(data: ChartData(values: [("2018 Q4",63150), ("2019 Q1",50900), ("2019 Q2",77550), ("2019 Q3",79600), ("2019 Q4",92550)]), title: "Sales", legend: "Quarterly") // legend is optional

仅点

 BarChartView(data: ChartData(points: [8,23,54,32,12,37,7,23,43]), title: "Title", legend: "Legendary") // legend is optional

ChartData 结构将值存储在数据对（实际上是元组）中：(String,Double)

• 您可以有重复的值
• 保持数据顺序

您可以通过多种方式初始化 ChartData

• 对于整数值：ChartData(points: [8,23,54,32,12,37,7,23,43])
• 对于浮点值：ChartData(points: [2.34,3.14,4.56])
• 对于标签、值对：ChartData(values: [("2018 Q4",63150), ("2019 Q1",50900)])

您可以添加不同的格式

• 小 ChartForm.small
• 中 ChartForm.medium
• 大 ChartForm.large

BarChartView(data: ChartData(points: [8,23,54,32,12,37,7,23,43]), title: "Title", form: ChartForm.small)

对于浮点数，您可以设置自定义说明符

BarChartView(data: ChartData(points:[1.23,2.43,3.37]) ,title: "A", valueSpecifier: "%.2f")

对于整数，您可以通过传递来禁用：valueSpecifier: "%.0f"

您可以通过在 initialiser 中传入自定义图像来在右上角设置自定义图像：cornerImage:Image(systemName: "waveform.path.ecg")

通过添加到 Initialiser 来关闭阴影：dropShadow: false

可定制

• 背景颜色
• 强调色
• 第二个渐变色
• 文字颜色
• 图例文本颜色

 let chartStyle = ChartStyle(backgroundColor: Color.black, accentColor: Colors.OrangeStart, secondGradientColor: Colors.OrangeEnd, chartFormSize: ChartForm.medium, textColor: Color.white, legendTextColor: Color.white )
 ...
 BarChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", style: chartStyle)

您可以访问内置样式

 BarChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", style: Styles.barChartMidnightGreen)

• barChartStyleOrangeLight
• barChartStyleOrangeDark
• barChartStyleNeonBlueLight
• barChartStyleNeonBlueDark
• barChartMidnightGreenLight
• barChartMidnightGreenDark

ChartForm

• .small
• .medium
• .large
• .detail

BarChartView(data: [8,23,54,32,12,37,7,23,43], title: "Title", form: ChartForm.small)

如果您想在完成手势后动画返回移动，则将 animatedToBack 设置为 true。

您可以使用以下代码添加饼图

 PieChartView(data: [8,23,54,32], title: "Title", legend: "Legendary") // legend is optional

通过添加到 Initialiser 来关闭阴影：dropShadow: false