TWRCharts:ChartJS的iOS 封装

 ,  , 

TWRCharts

TWRCharts 是一个针对 ChartJS 的 iOS 封装库,可以便捷的结合 Obj-C 原生代码构建出具有动画效果的图表。

TWRCharts 也是一个 iOS 图表库,基于著名的 ChartJS Javascript 库提供可以使用原生 Obj-C 代码调用的接口。它的意义在于,当程序员需要创建图表时,除了使用系统自带的方法外,还可以通过加载 ChartJS 的 Javascript 文件创建 TWRChartView 图表。

从 Javascript 文件加载图表非常简单,尽管这种方法的可配置性和动态效果比较差,但是用户可以通过原生扩展,动态更新数据,刷新图表。

目前,Obj-C 原生代码的 API 尚不支持 ChartJS 提供的所有图表类型,只有线形图、柱状图、饼状图和环形图可以使用。

TWRCharts 的核心类是 TWRChartView ,是加载 HTML 文件的 UIWebView 的子类,加载出的 HTML 文件不需要用户进行任何处理。经过精心设计,开发者和终端用户都可以通过这些 API 来获得非常接近 Obj-C 原生代码的体验。

 

TWRCharts Demo

要求

TWRCharts 要求 iOS 版本为 6.0及以上

安装

使用 CocoaPods 进行安装,添加依赖库到 Podfile 文件中:

运行 pod install 安装依赖库。

然后,在需要的地方导入头文件:

最后,在 TARGETS —> Build Phases —> Copy Bundle Resources 下,点击 + 按钮,添加 index.html 和 Chart.js 两个文件。

使用

创建图表视图

声明一个 TWRChartView 属性并通过其 frame 属性进行实例化,然后将它添加到视图控制器的 view 上:

从 JS 文件加载图表

在你的 Xcode 项目中添加一个 .js 文件,并确保该文件已经被添加到 TARGETS —> Build Phases —> Copy Bundle Resources 中。然后将该 .js 文件的路径设置为已经被添加到视图控制器的 view 上的 TWRChartView 的 js 文件路径。

你可以使用目前 ChartJS 支持的所有图表类型,下面是一个加载极坐标图的示例:

如果你想要使用 JS 文件来加载图表,请确保在 .js 文件的第一行添加如下代码:

这行代码的作用是从 TWRChartView 返回的 HTML 文件中读取正确的内容。

使用 Obj-C 原生代码加载图表

根据你所要绘制的图标的类型(线形图、柱状图、饼形图……),你需要实例化不同的对象,主要遵循以下步骤:

  • 实例化数据对象;
  • 通过标签和数据对象实例化图表对象;
  • 在图表视图上加载图表对象。

下面是一些示例代码:

数据集

TWRDataSet(描述线形图和柱状图的数据)可以通过下面的方法进行初始化:

线形图和柱状图的填充颜色和画笔颜色都可以自定义,对于线形图,你还可以选择点填充并自定义点画笔颜色。TWRDataSet 是一个元素为 NSNumber 类型数据的数组,存放用户必须提供的数据点。

线形图、柱状图

线形图和柱状图可以通过下面的方法进行初始化:

在向图表视图传递图表对象时,需要根据所处理的对象类型,通过 TWRChartView 实例调用下面方法中的一个:

贴心的 block 回调:你还可以选择在调用上述方法时添加一个 block ,来获取图表动画完成时的回调。你可能想象不到这些方法会在底层运行一串 Javascript 代码:

圆形图表

圆形图表可以通过下面的方法进行初始化:

你可以选择圆形图表的类型:饼状图(TWRCircularChartTypePie)或者环形图(TWRCircularChartTypeDoughnut)。

获得图表对象之后,你可以通过 TWRChartView 实例调用下面的方法来将图表对象添加到图表视图上:

开源协议

TWRCharts 在 MIT开源协议 下可以使用,也就是说,只要在项目副本中包含了版权声明和许可声明,用户就可以使用 TWRCharts 做任何想做的事情,而 TWRCharts 也无需承担任何责任。可以通过查看 LICENSE 文件来获取更多相关信息。

开源地址:https://github.com/chasseurmic/TWRCharts

打赏支持我整理更多优质资源,谢谢!

打赏编辑

打赏支持我整理更多优质资源,谢谢!

任选一种支付方式

1 1 收藏

资源整理者简介:魏川程



直接登录

推荐关注

按分类快速查找

关于资源导航
  • 伯乐在线资源导航收录优秀的工具资源。内容覆盖开发、设计、产品和管理等IT互联网行业相关的领域。目前已经收录 1440 项工具资源。
    推送伯乐头条热点内容微信号:jobbole 分享干货的技术类微信号:iProgrammer