README
react-native-apex-charts
A React Native module that allows you to use native chart UI .
此组件参照MPAndroidChart(android版本),Charts(ios版本)为原型实现
Release Notes
- 1.1.28 1 支持限制线属性配置;2 修正部分bug;3 iOS版本支持框架和源码两种方式Pod安装 4 支持文档生成功能
- 1.1.27 iOS版本提示框支持xAxisLabelColor、showSeparationLine、labelColor属性配置
- 1.1.26 修正部分bug
- 1.1.25 1 支持点击高亮所有属性;2 提示框支持圆角属性;3 改进曲线模式
- 1.1.10 改bug
- 1.1.8 支持XY缩放
- 1.1.7 图例支持自动换行属性;饼图支持绘制百分比属性
- 1.1.6 线性图支持画空心点及空心点半径颜色;XY支持标题及位置偏移
- 1.1.5 线性图支持个别点的样式定制;XY轴支持网格虚线及网格颜色
- 1.1.4 支持提示框、多数据集饼图
- 1.1.3 支持水平柱状图和混合图
- 1.1.2 支持默认高亮选中和高亮选中颜色属性配置
- 1.1.0 支持仪表盘控件
- 1.0.9 曲线图支持填充属性;X轴标签支持颜色配置;重构JS代码
- 1.0.8 支持柱状图
Install
第一步(两种方式)
方式1
解压本文件夹到node_modules/react-native-apex-charts
方式2
项目的package.json中配置
"dependencies": {
"react-native-apex-charts": "file:/Users/xxx/xxx/react-native-apex-charts"
}
第二步
方式1
在项目文件下运行
npm install react-native-apex-charts
react-native link react-native-apex-charts
iOS: 添加其它依赖库
以下文件需要手动添加到项目工程内:
在General-Embedded Binaries
中添加node_modules/react-native-apex-charts/ios/Charts.framework
(此文件也会自动添加到Link Binary With Libraries里)
在Build Settings
中的Framework Search Paths
中,增加:
$(SRCROOT)/../node_modules/react-native-apex-charts/ios
将Always Embed Swift Standard Libraries
设置为YES
方式2
iOS cocoapods本地安装,在Podfile
中添加
pod "RNCharts", :path => '/Users/XXX/XXX/node_modules/react-native-apex-charts/ios'
文档生成步骤
//安装docsify-cli工具(如果安装,跳下一步)
1.npm i docsify-cli -g
//文档初始化(如果已初始化,跳下一步)
2.docsify init ./docs
//生成文档同时打开本地浏览服务
3.npm run buildDocs
//用浏览器打开下面的地址
4.http://localhost:3000
Usage
具体例子详见RNApexUIExample/js/examples/chart/目录: https://github.com/glinjy/RNApexUIExample/tree/dev_chart