├── animiationX.gif ├── CxmChartView_demo.xcodeproj ├── project.xcworkspace │ └── contents.xcworkspacedata └── project.pbxproj ├── CxmChartView_demo ├── ViewController.h ├── UIColor │ ├── UIColor+Extra.h │ └── UIColor+Extra.m ├── AppDelegate.h ├── CXMChartView │ ├── UIBezierPath+curved.h │ ├── SmoothChartView.h │ ├── BrokenChartView.h │ ├── UIBezierPath+curved.m │ ├── SmoothChartView.m │ └── BrokenChartView.m ├── main.m ├── Assets.xcassets │ └── AppIcon.appiconset │ │ └── Contents.json ├── Info.plist ├── Base.lproj │ ├── Main.storyboard │ └── LaunchScreen.storyboard ├── AppDelegate.m └── ViewController.m ├── CXMChartView ├── UIBezierPath+curved.h ├── SmoothChartView.h ├── BrokenChartView.h ├── UIBezierPath+curved.m ├── SmoothChartView.m └── BrokenChartView.m ├── CxmChartView_demoTests ├── Info.plist └── CxmChartView_demoTests.m ├── CxmChartView_demoUITests ├── Info.plist └── CxmChartView_demoUITests.m ├── README.md ├── LICENSE └── .gitignore /animiationX.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chenXming/CXMChartView/HEAD/animiationX.gif -------------------------------------------------------------------------------- /CxmChartView_demo.xcodeproj/project.xcworkspace/contents.xcworkspacedata: -------------------------------------------------------------------------------- 1 | 2 | 4 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /CxmChartView_demo/ViewController.h: -------------------------------------------------------------------------------- 1 | // 2 | // ViewController.h 3 | // CxmChartView_demo 4 | // 5 | // Created by 陈小明 on 2017/6/1. 6 | // Copyright © 2017年陈小明. All rights reserved. 7 | // 8 | 9 | #import 10 | 11 | @interface ViewController : UIViewController 12 | 13 | 14 | @end 15 | 16 | -------------------------------------------------------------------------------- /CxmChartView_demo/UIColor/UIColor+Extra.h: -------------------------------------------------------------------------------- 1 | // 2 | // UIColor+Extra.h 3 | // Suppliers 4 | // 5 | // Created by liubo on 16/11/4. 6 | // Copyright © 2016年 wanshenglong. All rights reserved. 7 | // 8 | 9 | #import 10 | 11 | @interface UIColor (Extra) 12 | 13 | + (UIColor *) colorFromHexCode:(NSString *)hexString; 14 | 15 | @end 16 | -------------------------------------------------------------------------------- /CxmChartView_demo/AppDelegate.h: -------------------------------------------------------------------------------- 1 | // 2 | // AppDelegate.h 3 | // CxmChartView_demo 4 | // 5 | // Created by 陈小明 on 2017/6/1. 6 | // Copyright © 2017年陈小明. All rights reserved. 7 | // 8 | 9 | #import 10 | 11 | @interface AppDelegate : UIResponder 12 | 13 | @property (strong, nonatomic) UIWindow *window; 14 | 15 | 16 | @end 17 | 18 | -------------------------------------------------------------------------------- /CXMChartView/UIBezierPath+curved.h: -------------------------------------------------------------------------------- 1 | // 2 | // UIBezierPath+curved.h 3 | // MPPlot 4 | // 5 | // Created by Alex Manzella on 22/05/14. 6 | // Copyright (c) 2014 mpow. All rights reserved. 7 | // 8 | // 平滑曲线绘制 9 | #import 10 | 11 | @interface UIBezierPath (curved) 12 | 13 | 14 | - (UIBezierPath*)smoothedPathWithGranularity:(NSInteger)granularity; 15 | 16 | @end 17 | -------------------------------------------------------------------------------- /CxmChartView_demo/CXMChartView/UIBezierPath+curved.h: -------------------------------------------------------------------------------- 1 | // 2 | // UIBezierPath+curved.h 3 | // MPPlot 4 | // 5 | // Created by Alex Manzella on 22/05/14. 6 | // Copyright (c) 2014 mpow. All rights reserved. 7 | // 8 | // 平滑曲线绘制 9 | #import 10 | 11 | @interface UIBezierPath (curved) 12 | 13 | 14 | - (UIBezierPath*)smoothedPathWithGranularity:(NSInteger)granularity; 15 | 16 | @end 17 | -------------------------------------------------------------------------------- /CxmChartView_demo/main.m: -------------------------------------------------------------------------------- 1 | // 2 | // main.m 3 | // CxmChartView_demo 4 | // 5 | // Created by 陈小明 on 2017/6/1. 6 | // Copyright © 2017年陈小明. All rights reserved. 7 | // 8 | 9 | #import 10 | #import "AppDelegate.h" 11 | 12 | int main(int argc, char * argv[]) { 13 | @autoreleasepool { 14 | return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class])); 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /CXMChartView/SmoothChartView.h: -------------------------------------------------------------------------------- 1 | // 2 | // SmoothChartView.h 3 | // AseanData 4 | // 5 | // Created by 陈小明 on 2017/4/24. 6 | // Copyright © 2017年 wanshenglong. All rights reserved. 7 | // 8 | 9 | #import 10 | 11 | @interface SmoothChartView : UIView 12 | 13 | /* 14 | * X 轴的刻度数字 15 | */ 16 | @property (nonatomic,strong)NSArray *arrX; 17 | 18 | /* 19 | * Y 轴的刻度数字 20 | */ 21 | @property (nonatomic,strong)NSArray *arrY; 22 | 23 | /* 24 | * 刷新数据重新开始动画 25 | */ 26 | -(void)refreshChartAnmition; 27 | 28 | /* 根据数据源画图 29 | * pathX :横坐标数据 30 | * 31 | * pathY :纵坐标数据源 32 | * X 是横坐标需要变换的值 33 | */ 34 | -(void)drawSmoothViewWithArrayX:(NSArray*)pathX andArrayY:(NSArray*)pathY andScaleX:(float)X; 35 | 36 | @end 37 | -------------------------------------------------------------------------------- /CxmChartView_demo/CXMChartView/SmoothChartView.h: -------------------------------------------------------------------------------- 1 | // 2 | // SmoothChartView.h 3 | // AseanData 4 | // 5 | // Created by 陈小明 on 2017/4/24. 6 | // Copyright © 2017年 wanshenglong. All rights reserved. 7 | // 8 | 9 | #import 10 | 11 | @interface SmoothChartView : UIView 12 | 13 | /* 14 | * X 轴的刻度数字 15 | */ 16 | @property (nonatomic,strong)NSArray *arrX; 17 | 18 | /* 19 | * Y 轴的刻度数字 20 | */ 21 | @property (nonatomic,strong)NSArray *arrY; 22 | 23 | /* 24 | * 刷新数据重新开始动画 25 | */ 26 | -(void)refreshChartAnmition; 27 | 28 | /* 根据数据源画图 29 | * pathX :横坐标数据 30 | * 31 | * pathY :纵坐标数据源 32 | * X:X轴需要切割的份数 33 | */ 34 | -(void)drawSmoothViewWithArrayX:(NSArray*)pathX andArrayY:(NSArray*)pathY andScaleX:(float)X; 35 | 36 | @end 37 | -------------------------------------------------------------------------------- /CxmChartView_demoTests/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | $(PRODUCT_BUNDLE_IDENTIFIER) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | BNDL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleVersion 20 | 1 21 | 22 | 23 | -------------------------------------------------------------------------------- /CxmChartView_demoUITests/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | $(PRODUCT_BUNDLE_IDENTIFIER) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | BNDL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleVersion 20 | 1 21 | 22 | 23 | -------------------------------------------------------------------------------- /CXMChartView/BrokenChartView.h: -------------------------------------------------------------------------------- 1 | // 2 | // BrokenChartView.h 3 | // AseanData 4 | // 5 | // Created by 陈小明 on 2017/4/25. 6 | // Copyright © 2017年 wanshenglong. All rights reserved. 7 | // 8 | 9 | #import 10 | 11 | @interface BrokenChartView : UIView 12 | 13 | /* 14 | * X 轴的刻度数字 15 | */ 16 | @property (nonatomic,strong)NSArray *arrX; 17 | 18 | /* 19 | * Y 轴的刻度数字左侧纵轴的刻度 20 | */ 21 | @property (nonatomic,strong)NSArray *arrLeftY; 22 | 23 | /* 24 | * Y 轴的刻度数字右侧纵轴的刻度 25 | */ 26 | @property (nonatomic,strong)NSArray *arrRightY; 27 | 28 | /* 29 | * 刷新数据重新开始动画 30 | */ 31 | -(void)refreshChartAnmition; 32 | 33 | /* 根据数据源画图 34 | * pathX :横坐标数据 35 | * 纵坐标右侧刻度基准 36 | * pathY :纵坐标数据源 37 | */ 38 | -(void)drawRightChartViewWithArrayX:(NSArray*)pathX ArrayY:(NSArray*)pathY andScaleX:(float)X; 39 | 40 | /* 根据数据源画图 41 | * pathX :横坐标数据 42 | * 纵坐标左侧刻度基准 43 | * pathY :纵坐标数据源 44 | */ 45 | -(void)drawLeftChartViewWithArrayX:(NSArray*)pathX ArrayY:(NSArray*)pathY andScaleX:(float)X; 46 | 47 | @end 48 | -------------------------------------------------------------------------------- /CxmChartView_demo/CXMChartView/BrokenChartView.h: -------------------------------------------------------------------------------- 1 | // 2 | // BrokenChartView.h 3 | // AseanData 4 | // 5 | // Created by 陈小明 on 2017/4/25. 6 | // Copyright © 2017年 wanshenglong. All rights reserved. 7 | // 8 | 9 | #import 10 | 11 | @interface BrokenChartView : UIView 12 | 13 | /* 14 | * X 轴的刻度数字 15 | */ 16 | @property (nonatomic,strong)NSArray *arrX; 17 | 18 | /* 19 | * Y 轴的刻度数字左侧纵轴的刻度 20 | */ 21 | @property (nonatomic,strong)NSArray *arrLeftY; 22 | 23 | /* 24 | * Y 轴的刻度数字右侧纵轴的刻度 25 | */ 26 | @property (nonatomic,strong)NSArray *arrRightY; 27 | 28 | /* 29 | * 刷新数据重新开始动画 30 | */ 31 | -(void)refreshChartAnmition; 32 | 33 | /* 根据数据源画图 34 | * pathX :横坐标数据 35 | * 纵坐标右侧刻度基准 36 | * pathY :纵坐标数据源 37 | * X:X轴需要切割的份数 38 | */ 39 | -(void)drawRightChartViewWithArrayX:(NSArray*)pathX ArrayY:(NSArray*)pathY andScaleX:(float)X; 40 | 41 | /* 根据数据源画图 42 | * pathX :横坐标数据 43 | * 纵坐标左侧刻度基准 44 | * pathY :纵坐标数据源 45 | * X : X轴需要切割的份数 46 | */ 47 | -(void)drawLeftChartViewWithArrayX:(NSArray*)pathX ArrayY:(NSArray*)pathY andScaleX:(float)X; 48 | 49 | @end 50 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # CXMChartView 2 | 一个简易的轻量级的画折线图类库 3 | 前几天接到业务需求需要画折线图，网上也看了许多的资料，也有许多封装好的第三方类库比如`AAChartKit `、`XYPieChart`、`PNChart`等好多，不过这些类库大多封装的太厉害了，我这边的业务需求有比较简单，就是单纯的绘制折线图并保证是平滑的曲线，而且要有添加渐变阴影。说下我的思路： 4 | * 先画整个表的横纵坐标系 5 | * 画出纵坐标延伸的网格线 6 | * 添加横纵坐标数字 7 | * 绘制折线 8 | * 变成平滑曲线 9 | * 绘制渐变阴影 10 | 最后得到效果是这样婶儿的 11 | 12 | ![animiation.gif](http://upload-images.jianshu.io/upload_images/1977395-de6821625821ae3d.gif?imageMogr2/auto-orient/strip)
13 | 具体的使用方法：引入文件夹`CXMChartView`到工程,文件`SmoothChartView`是画平滑的曲线并带阴影的图，文件`BrokenChartView`是画双坐标没有阴影的折线图，可以根据自己的需要进行使用和修改。 14 | ``` 15 | /* 16 | * X 轴的刻度数字 17 | */ 18 | @property (nonatomic,strong)NSArray *arrX; 19 | 20 | /* 21 | * Y 轴的刻度数字 22 | */ 23 | @property (nonatomic,strong)NSArray *arrY; 24 | 25 | /* 26 | * 刷新数据重新开始动画 27 | */ 28 | -(void)refreshChartAnmition; 29 | 30 | /* 根据数据源画图 31 | * pathX :横坐标数据 32 | * 33 | * pathY :纵坐标数据源 34 | * X 是横坐标需要变换的值 35 | */ 36 | -(void)drawSmoothViewWithArrayX:(NSArray*)pathX andArrayY:(NSArray*)pathY andScaleX:(float)X; 37 | ``` 38 | demo的实现效果是这样这样婶儿的
![](https://github.com/chenXming/CXMChartView/raw/master/animiationX.gif) 39 | 40 | -------------------------------------------------------------------------------- /CxmChartView_demoTests/CxmChartView_demoTests.m: -------------------------------------------------------------------------------- 1 | // 2 | // CxmChartView_demoTests.m 3 | // CxmChartView_demoTests 4 | // 5 | // Created by 陈小明 on 2017/6/1. 6 | // Copyright © 2017年陈小明. All rights reserved. 7 | // 8 | 9 | #import 10 | 11 | @interface CxmChartView_demoTests : XCTestCase 12 | 13 | @end 14 | 15 | @implementation CxmChartView_demoTests 16 | 17 | - (void)setUp { 18 | [super setUp]; 19 | // Put setup code here. This method is called before the invocation of each test method in the class. 20 | } 21 | 22 | - (void)tearDown { 23 | // Put teardown code here. This method is called after the invocation of each test method in the class. 24 | [super tearDown]; 25 | } 26 | 27 | - (void)testExample { 28 | // This is an example of a functional test case. 29 | // Use XCTAssert and related functions to verify your tests produce the correct results. 30 | } 31 | 32 | - (void)testPerformanceExample { 33 | // This is an example of a performance test case. 34 | [self measureBlock:^{ 35 | // Put the code you want to measure the time of here. 36 | }]; 37 | } 38 | 39 | @end 40 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 cxm 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /CxmChartView_demo/Assets.xcassets/AppIcon.appiconset/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "idiom" : "iphone", 5 | "size" : "29x29", 6 | "scale" : "2x" 7 | }, 8 | { 9 | "idiom" : "iphone", 10 | "size" : "29x29", 11 | "scale" : "3x" 12 | }, 13 | { 14 | "idiom" : "iphone", 15 | "size" : "40x40", 16 | "scale" : "2x" 17 | }, 18 | { 19 | "idiom" : "iphone", 20 | "size" : "40x40", 21 | "scale" : "3x" 22 | }, 23 | { 24 | "idiom" : "iphone", 25 | "size" : "60x60", 26 | "scale" : "2x" 27 | }, 28 | { 29 | "idiom" : "iphone", 30 | "size" : "60x60", 31 | "scale" : "3x" 32 | }, 33 | { 34 | "idiom" : "ipad", 35 | "size" : "29x29", 36 | "scale" : "1x" 37 | }, 38 | { 39 | "idiom" : "ipad", 40 | "size" : "29x29", 41 | "scale" : "2x" 42 | }, 43 | { 44 | "idiom" : "ipad", 45 | "size" : "40x40", 46 | "scale" : "1x" 47 | }, 48 | { 49 | "idiom" : "ipad", 50 | "size" : "40x40", 51 | "scale" : "2x" 52 | }, 53 | { 54 | "idiom" : "ipad", 55 | "size" : "76x76", 56 | "scale" : "1x" 57 | }, 58 | { 59 | "idiom" : "ipad", 60 | "size" : "76x76", 61 | "scale" : "2x" 62 | } 63 | ], 64 | "info" : { 65 | "version" : 1, 66 | "author" : "xcode" 67 | } 68 | } -------------------------------------------------------------------------------- /CxmChartView_demoUITests/CxmChartView_demoUITests.m: -------------------------------------------------------------------------------- 1 | // 2 | // CxmChartView_demoUITests.m 3 | // CxmChartView_demoUITests 4 | // 5 | // Created by 陈小明 on 2017/6/1. 6 | // Copyright © 2017年陈小明. All rights reserved. 7 | // 8 | 9 | #import 10 | 11 | @interface CxmChartView_demoUITests : XCTestCase 12 | 13 | @end 14 | 15 | @implementation CxmChartView_demoUITests 16 | 17 | - (void)setUp { 18 | [super setUp]; 19 | 20 | // Put setup code here. This method is called before the invocation of each test method in the class. 21 | 22 | // In UI tests it is usually best to stop immediately when a failure occurs. 23 | self.continueAfterFailure = NO; 24 | // UI tests must launch the application that they test. Doing this in setup will make sure it happens for each test method. 25 | [[[XCUIApplication alloc] init] launch]; 26 | 27 | // In UI tests it’s important to set the initial state - such as interface orientation - required for your tests before they run. The setUp method is a good place to do this. 28 | } 29 | 30 | - (void)tearDown { 31 | // Put teardown code here. This method is called after the invocation of each test method in the class. 32 | [super tearDown]; 33 | } 34 | 35 | - (void)testExample { 36 | // Use recording to get started writing UI tests. 37 | // Use XCTAssert and related functions to verify your tests produce the correct results. 38 | } 39 | 40 | @end 41 | -------------------------------------------------------------------------------- /CxmChartView_demo/UIColor/UIColor+Extra.m: -------------------------------------------------------------------------------- 1 | // 2 | // UIColor+Extra.m 3 | // Suppliers 4 | // 5 | // Created by liubo on 16/11/4. 6 | // Copyright © 2016年 wanshenglong. All rights reserved. 7 | // 8 | 9 | #import "UIColor+Extra.h" 10 | 11 | @implementation UIColor (Extra) 12 | 13 | + (UIColor *) colorFromHexCode:(NSString *)hexString { 14 | NSString *cleanString = [hexString stringByReplacingOccurrencesOfString:@"#" withString:@""]; 15 | if([cleanString length] == 3) { 16 | cleanString = [NSString stringWithFormat:@"%@%@%@%@%@%@", 17 | [cleanString substringWithRange:NSMakeRange(0, 1)],[cleanString substringWithRange:NSMakeRange(0, 1)], 18 | [cleanString substringWithRange:NSMakeRange(1, 1)],[cleanString substringWithRange:NSMakeRange(1, 1)], 19 | [cleanString substringWithRange:NSMakeRange(2, 1)],[cleanString substringWithRange:NSMakeRange(2, 1)]]; 20 | } 21 | if([cleanString length] == 6) { 22 | cleanString = [cleanString stringByAppendingString:@"ff"]; 23 | } 24 | 25 | unsigned int baseValue; 26 | [[NSScanner scannerWithString:cleanString] scanHexInt:&baseValue]; 27 | 28 | float red = ((baseValue >> 24) & 0xFF)/255.0f; 29 | float green = ((baseValue >> 16) & 0xFF)/255.0f; 30 | float blue = ((baseValue >> 8) & 0xFF)/255.0f; 31 | float alpha = ((baseValue >> 0) & 0xFF)/255.0f; 32 | 33 | return [UIColor colorWithRed:red green:green blue:blue alpha:alpha]; 34 | } 35 | 36 | @end 37 | -------------------------------------------------------------------------------- /CxmChartView_demo/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | $(PRODUCT_BUNDLE_IDENTIFIER) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | APPL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleVersion 20 | 1 21 | LSRequiresIPhoneOS 22 | 23 | UILaunchStoryboardName 24 | LaunchScreen 25 | UIMainStoryboardFile 26 | Main 27 | UIRequiredDeviceCapabilities 28 | 29 | armv7 30 | 31 | UISupportedInterfaceOrientations 32 | 33 | UIInterfaceOrientationPortrait 34 | UIInterfaceOrientationLandscapeLeft 35 | UIInterfaceOrientationLandscapeRight 36 | 37 | UISupportedInterfaceOrientations~ipad 38 | 39 | UIInterfaceOrientationPortrait 40 | UIInterfaceOrientationPortraitUpsideDown 41 | UIInterfaceOrientationLandscapeLeft 42 | UIInterfaceOrientationLandscapeRight 43 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Xcode 2 | # 3 | # gitignore contributors: remember to update Global/Xcode.gitignore, Objective-C.gitignore & Swift.gitignore 4 | 5 | ## Build generated 6 | build/ 7 | DerivedData/ 8 | 9 | ## Various settings 10 | *.pbxuser 11 | !default.pbxuser 12 | *.mode1v3 13 | !default.mode1v3 14 | *.mode2v3 15 | !default.mode2v3 16 | *.perspectivev3 17 | !default.perspectivev3 18 | xcuserdata/ 19 | 20 | ## Other 21 | *.moved-aside 22 | *.xccheckout 23 | *.xcscmblueprint 24 | 25 | ## Obj-C/Swift specific 26 | *.hmap 27 | *.ipa 28 | *.dSYM.zip 29 | *.dSYM 30 | 31 | # CocoaPods 32 | # 33 | # We recommend against adding the Pods directory to your .gitignore. However 34 | # you should judge for yourself, the pros and cons are mentioned at: 35 | # https://guides.cocoapods.org/using/using-cocoapods.html#should-i-check-the-pods-directory-into-source-control 36 | # 37 | # Pods/ 38 | 39 | # Carthage 40 | # 41 | # Add this line if you want to avoid checking in source code from Carthage dependencies. 42 | # Carthage/Checkouts 43 | 44 | Carthage/Build 45 | 46 | # fastlane 47 | # 48 | # It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the 49 | # screenshots whenever they are needed. 50 | # For more information about the recommended setup visit: 51 | # https://docs.fastlane.tools/best-practices/source-control/#source-control 52 | 53 | fastlane/report.xml 54 | fastlane/Preview.html 55 | fastlane/screenshots 56 | fastlane/test_output 57 | 58 | # Code Injection 59 | # 60 | # After new code Injection tools there's a generated folder /iOSInjectionProject 61 | # https://github.com/johnno1962/injectionforxcode 62 | 63 | iOSInjectionProject/ 64 | -------------------------------------------------------------------------------- /CxmChartView_demo/Base.lproj/Main.storyboard: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /CxmChartView_demo/Base.lproj/LaunchScreen.storyboard: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /CxmChartView_demo/AppDelegate.m: -------------------------------------------------------------------------------- 1 | // 2 | // AppDelegate.m 3 | // CxmChartView_demo 4 | // 5 | // Created by 陈小明 on 2017/6/1. 6 | // Copyright © 2017年陈小明. All rights reserved. 7 | // 8 | 9 | #import "AppDelegate.h" 10 | 11 | @interface AppDelegate () 12 | 13 | @end 14 | 15 | @implementation AppDelegate 16 | 17 | 18 | - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { 19 | // Override point for customization after application launch. 20 | return YES; 21 | } 22 | 23 | 24 | - (void)applicationWillResignActive:(UIApplication *)application { 25 | // Sent when the application is about to move from active to inactive state. This can occur for certain types of temporary interruptions (such as an incoming phone call or SMS message) or when the user quits the application and it begins the transition to the background state. 26 | // Use this method to pause ongoing tasks, disable timers, and invalidate graphics rendering callbacks. Games should use this method to pause the game. 27 | } 28 | 29 | 30 | - (void)applicationDidEnterBackground:(UIApplication *)application { 31 | // Use this method to release shared resources, save user data, invalidate timers, and store enough application state information to restore your application to its current state in case it is terminated later. 32 | // If your application supports background execution, this method is called instead of applicationWillTerminate: when the user quits. 33 | } 34 | 35 | 36 | - (void)applicationWillEnterForeground:(UIApplication *)application { 37 | // Called as part of the transition from the background to the active state; here you can undo many of the changes made on entering the background. 38 | } 39 | 40 | 41 | - (void)applicationDidBecomeActive:(UIApplication *)application { 42 | // Restart any tasks that were paused (or not yet started) while the application was inactive. If the application was previously in the background, optionally refresh the user interface. 43 | } 44 | 45 | 46 | - (void)applicationWillTerminate:(UIApplication *)application { 47 | // Called when the application is about to terminate. Save data if appropriate. See also applicationDidEnterBackground:. 48 | } 49 | 50 | 51 | @end 52 | -------------------------------------------------------------------------------- /CxmChartView_demo/ViewController.m: -------------------------------------------------------------------------------- 1 | // 2 | // ViewController.m 3 | // CxmChartView_demo 4 | // 5 | // Created by 陈小明 on 2017/6/1. 6 | // Copyright © 2017年陈小明. All rights reserved. 7 | // 8 | 9 | #import "ViewController.h" 10 | #import "SmoothChartView.h" 11 | #import "BrokenChartView.h" 12 | 13 | @interface ViewController () 14 | { 15 | 16 | SmoothChartView *_smoothView; 17 | 18 | BrokenChartView *_brokenView; 19 | 20 | } 21 | @end 22 | 23 | @implementation ViewController 24 | 25 | - (void)viewDidLoad { 26 | [super viewDidLoad]; 27 | 28 | self.view.backgroundColor = [UIColor whiteColor]; 29 | 30 | // 平滑曲线带阴影 31 | [self makeSmoothChartView]; 32 | 33 | //双基准坐标折线图 34 | [self makeBrokenChartView]; 35 | 36 | UITapGestureRecognizer *tapGes = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapGesDown)]; 37 | 38 | [self.view addGestureRecognizer:tapGes]; 39 | 40 | 41 | } 42 | #pragma mark - 作图表 43 | -(void)makeSmoothChartView{ 44 | 45 | _smoothView = [[SmoothChartView alloc] initWithFrame:CGRectMake(30, 227/2, 616/2,392/2)]; 46 | _smoothView.backgroundColor = [UIColor whiteColor]; 47 | //X轴刻度 48 | _smoothView.arrX = @[@"9时",@"13时",@"18时"]; 49 | // Y轴刻度 50 | _smoothView.arrY = @[@"0",@"10",@"20",@"30",@"40",@"50"]; 51 | 52 | [self.view addSubview:_smoothView]; 53 | 54 | [_smoothView refreshChartAnmition]; 55 | NSArray *pathX = @[@"1",@"2",@"3",@"4",@"5",@"6",@"7",@"8",@"9",@"10"]; 56 | NSArray *pathY = @[@"19",@"27",@"8",@"38",@"30",@"45",@"40",@"48",@"22",@"7"]; 57 | 58 | [_smoothView drawSmoothViewWithArrayX:pathX andArrayY:pathY andScaleX:12.0]; 59 | 60 | 61 | } 62 | -(void)makeBrokenChartView{ 63 | 64 | 65 | _brokenView = [[BrokenChartView alloc] initWithFrame:CGRectMake(30, 350,680/2,392/2)]; 66 | _brokenView.backgroundColor = [UIColor whiteColor]; 67 | _brokenView.arrX =@[@"9时",@"13时",@"18时"]; 68 | _brokenView.arrLeftY =@[@"0",@"10",@"20",@"30",@"40",@"50"]; 69 | _brokenView.arrRightY = @[@"0",@"100",@"200",@"300",@"400",@"500"]; 70 | 71 | [self.view addSubview:_brokenView]; 72 | 73 | NSArray *pathX = @[@"1",@"2",@"3",@"4",@"5",@"6",@"7",@"8",@"9",@"10"]; 74 | NSArray *arrLeft= @[@"5",@"10",@"15",@"26",@"29",@"22",@"33",@"38",@"45",@"49"]; 75 | NSArray *arrRight= @[@"50",@"100",@"120",@"230",@"129",@"202",@"300",@"308",@"450",@"480"]; 76 | 77 | [_brokenView drawLeftChartViewWithArrayX:pathX ArrayY:arrLeft andScaleX:12]; 78 | [_brokenView drawRightChartViewWithArrayX:pathX ArrayY:arrRight andScaleX:12]; 79 | 80 | } 81 | -(void)tapGesDown{ 82 | 83 | [_smoothView refreshChartAnmition]; 84 | 85 | [_brokenView refreshChartAnmition]; 86 | 87 | } 88 | 89 | - (void)didReceiveMemoryWarning { 90 | [super didReceiveMemoryWarning]; 91 | // Dispose of any resources that can be recreated. 92 | } 93 | 94 | 95 | @end 96 | -------------------------------------------------------------------------------- /CXMChartView/UIBezierPath+curved.m: -------------------------------------------------------------------------------- 1 | // 2 | // UIBezierPath+curved.m 3 | // MPPlot 4 | // 5 | // Created by Alex Manzella on 22/05/14. 6 | // Copyright (c) 2014 mpow. All rights reserved. 7 | // 8 | 9 | #import "UIBezierPath+curved.h" 10 | 11 | // Based on code from Erica Sadun 12 | 13 | void getPointsFromBezier(void *info, const CGPathElement *element); 14 | NSArray *pointsFromBezierPath(UIBezierPath *bpath); 15 | 16 | 17 | #define VALUE(_INDEX_) [NSValue valueWithCGPoint:points[_INDEX_]] 18 | #define POINT(_INDEX_) [(NSValue *)[points objectAtIndex:_INDEX_] CGPointValue] 19 | 20 | @implementation UIBezierPath (curved) 21 | 22 | 23 | // Get points from Bezier Curve 24 | void getPointsFromBezier(void *info, const CGPathElement *element) 25 | { 26 | NSMutableArray *bezierPoints = (__bridge NSMutableArray *)info; 27 | 28 | // Retrieve the path element type and its points 29 | CGPathElementType type = element->type; 30 | CGPoint *points = element->points; 31 | 32 | // Add the points if they're available (per type) 33 | if (type != kCGPathElementCloseSubpath) 34 | { 35 | [bezierPoints addObject:VALUE(0)]; 36 | if ((type != kCGPathElementAddLineToPoint) && 37 | (type != kCGPathElementMoveToPoint)) 38 | [bezierPoints addObject:VALUE(1)]; 39 | } 40 | if (type == kCGPathElementAddCurveToPoint) 41 | [bezierPoints addObject:VALUE(2)]; 42 | } 43 | 44 | NSArray *pointsFromBezierPath(UIBezierPath *bpath) 45 | { 46 | NSMutableArray *points = [NSMutableArray array]; 47 | CGPathApply(bpath.CGPath, (__bridge void *)points, getPointsFromBezier); 48 | 49 | //NSLog(@"points===%@",points); 50 | return points; 51 | } 52 | 53 | - (UIBezierPath*)smoothedPathWithGranularity:(NSInteger)granularity; 54 | { 55 | NSMutableArray *points = [pointsFromBezierPath(self) mutableCopy]; 56 | 57 | if (points.count < 4) return [self copy]; 58 | 59 | // Add control points to make the math make sense 60 | [points insertObject:[points objectAtIndex:0] atIndex:0]; 61 | [points addObject:[points lastObject]]; 62 | 63 | UIBezierPath *smoothedPath = [self copy]; 64 | [smoothedPath removeAllPoints]; 65 | 66 | [smoothedPath moveToPoint:POINT(0)]; 67 | 68 | for (NSUInteger index = 1; index < points.count - 2; index++) 69 | { 70 | CGPoint p0 = POINT(index - 1); 71 | CGPoint p1 = POINT(index); 72 | CGPoint p2 = POINT(index + 1); 73 | CGPoint p3 = POINT(index + 2); 74 | 75 | // now add n points starting at p1 + dx/dy up until p2 using Catmull-Rom splines 76 | for (int i = 1; i < granularity; i++) 77 | { 78 | float t = (float) i * (1.0f / (float) granularity); 79 | float tt = t * t; 80 | float ttt = tt * t; 81 | 82 | CGPoint pi; // intermediate point 83 | pi.x = 0.5 * (2*p1.x+(p2.x-p0.x)*t + (2*p0.x-5*p1.x+4*p2.x-p3.x)*tt + (3*p1.x-p0.x-3*p2.x+p3.x)*ttt); 84 | pi.y = 0.5 * (2*p1.y+(p2.y-p0.y)*t + (2*p0.y-5*p1.y+4*p2.y-p3.y)*tt + (3*p1.y-p0.y-3*p2.y+p3.y)*ttt); 85 | [smoothedPath addLineToPoint:pi]; 86 | } 87 | 88 | // Now add p2 89 | [smoothedPath addLineToPoint:p2]; 90 | } 91 | 92 | // finish by adding the last point 93 | [smoothedPath addLineToPoint:POINT(points.count - 1)]; 94 | 95 | return smoothedPath; 96 | } 97 | 98 | 99 | @end 100 | -------------------------------------------------------------------------------- /CxmChartView_demo/CXMChartView/UIBezierPath+curved.m: -------------------------------------------------------------------------------- 1 | // 2 | // UIBezierPath+curved.m 3 | // MPPlot 4 | // 5 | // Created by Alex Manzella on 22/05/14. 6 | // Copyright (c) 2014 mpow. All rights reserved. 7 | // 8 | 9 | #import "UIBezierPath+curved.h" 10 | 11 | // Based on code from Erica Sadun 12 | 13 | void getPointsFromBezier(void *info, const CGPathElement *element); 14 | NSArray *pointsFromBezierPath(UIBezierPath *bpath); 15 | 16 | 17 | #define VALUE(_INDEX_) [NSValue valueWithCGPoint:points[_INDEX_]] 18 | #define POINT(_INDEX_) [(NSValue *)[points objectAtIndex:_INDEX_] CGPointValue] 19 | 20 | @implementation UIBezierPath (curved) 21 | 22 | 23 | // Get points from Bezier Curve 24 | void getPointsFromBezier(void *info, const CGPathElement *element) 25 | { 26 | NSMutableArray *bezierPoints = (__bridge NSMutableArray *)info; 27 | 28 | // Retrieve the path element type and its points 29 | CGPathElementType type = element->type; 30 | CGPoint *points = element->points; 31 | 32 | // Add the points if they're available (per type) 33 | if (type != kCGPathElementCloseSubpath) 34 | { 35 | [bezierPoints addObject:VALUE(0)]; 36 | if ((type != kCGPathElementAddLineToPoint) && 37 | (type != kCGPathElementMoveToPoint)) 38 | [bezierPoints addObject:VALUE(1)]; 39 | } 40 | if (type == kCGPathElementAddCurveToPoint) 41 | [bezierPoints addObject:VALUE(2)]; 42 | } 43 | 44 | NSArray *pointsFromBezierPath(UIBezierPath *bpath) 45 | { 46 | NSMutableArray *points = [NSMutableArray array]; 47 | CGPathApply(bpath.CGPath, (__bridge void *)points, getPointsFromBezier); 48 | 49 | //NSLog(@"points===%@",points); 50 | return points; 51 | } 52 | 53 | - (UIBezierPath*)smoothedPathWithGranularity:(NSInteger)granularity; 54 | { 55 | NSMutableArray *points = [pointsFromBezierPath(self) mutableCopy]; 56 | 57 | if (points.count < 4) return [self copy]; 58 | 59 | // Add control points to make the math make sense 60 | [points insertObject:[points objectAtIndex:0] atIndex:0]; 61 | [points addObject:[points lastObject]]; 62 | 63 | UIBezierPath *smoothedPath = [self copy]; 64 | [smoothedPath removeAllPoints]; 65 | 66 | [smoothedPath moveToPoint:POINT(0)]; 67 | 68 | for (NSUInteger index = 1; index < points.count - 2; index++) 69 | { 70 | CGPoint p0 = POINT(index - 1); 71 | CGPoint p1 = POINT(index); 72 | CGPoint p2 = POINT(index + 1); 73 | CGPoint p3 = POINT(index + 2); 74 | 75 | // now add n points starting at p1 + dx/dy up until p2 using Catmull-Rom splines 76 | for (int i = 1; i < granularity; i++) 77 | { 78 | float t = (float) i * (1.0f / (float) granularity); 79 | float tt = t * t; 80 | float ttt = tt * t; 81 | 82 | CGPoint pi; // intermediate point 83 | pi.x = 0.5 * (2*p1.x+(p2.x-p0.x)*t + (2*p0.x-5*p1.x+4*p2.x-p3.x)*tt + (3*p1.x-p0.x-3*p2.x+p3.x)*ttt); 84 | pi.y = 0.5 * (2*p1.y+(p2.y-p0.y)*t + (2*p0.y-5*p1.y+4*p2.y-p3.y)*tt + (3*p1.y-p0.y-3*p2.y+p3.y)*ttt); 85 | [smoothedPath addLineToPoint:pi]; 86 | } 87 | 88 | // Now add p2 89 | [smoothedPath addLineToPoint:p2]; 90 | } 91 | 92 | // finish by adding the last point 93 | [smoothedPath addLineToPoint:POINT(points.count - 1)]; 94 | 95 | return smoothedPath; 96 | } 97 | 98 | 99 | @end 100 | -------------------------------------------------------------------------------- /CXMChartView/SmoothChartView.m: -------------------------------------------------------------------------------- 1 | // 2 | // SmoothChartView.m 3 | // AseanData 4 | // 5 | // Created by 陈小明 on 2017/4/24. 6 | // Copyright © 2017年 wanshenglong. All rights reserved. 7 | //平滑的曲线 8 | 9 | #import "SmoothChartView.h" 10 | #import "UIBezierPath+curved.h" 11 | 12 | @interface SmoothChartView () 13 | { 14 | CAShapeLayer *anmitionLayer; 15 | CAGradientLayer *gradientLayer; 16 | NSMutableArray *_pointArr; 17 | 18 | //X轴 19 | CAShapeLayer *layerX; 20 | 21 | //纵坐标轴 22 | CAShapeLayer *layerY; 23 | 24 | CAShapeLayer *_bottomLayer; 25 | 26 | } 27 | @end 28 | #define VIEW_WIDTH self.frame.size.width 29 | #define VIEW_HEIGHT self.frame.size.height 30 | 31 | #define LABLE_WIDTH 280 32 | #define LABLE_HEIGHT 149 33 | 34 | @implementation SmoothChartView 35 | 36 | - (instancetype)initWithFrame:(CGRect)frame 37 | { 38 | self = [super initWithFrame:frame]; 39 | if (self) { 40 | 41 | [self initData]; 42 | // X轴 43 | [self makeChartXView]; 44 | // Y轴 45 | [self makeChartYView]; 46 | // 承载曲线图的View 47 | [self makeBottomlayer]; 48 | 49 | } 50 | return self; 51 | } 52 | -(void)initData{ 53 | 54 | _pointArr = [[NSMutableArray alloc] initWithCapacity:0]; 55 | } 56 | -(void)makeChartXView{ 57 | 58 | //X轴 59 | layerX = [CAShapeLayer layer]; 60 | layerX.frame = CGRectMake(25,LABLE_HEIGHT + 25, LABLE_WIDTH, 1); 61 | layerX.backgroundColor = [UIColor colorFromHexCode:@"d8d8d8"].CGColor; 62 | [self.layer addSublayer:layerX]; 63 | 64 | } 65 | -(void)makeChartYView{ 66 | 67 | //左侧纵坐标轴 68 | layerY = [CAShapeLayer layer]; 69 | layerY.frame = CGRectMake(25,25, 1, LABLE_HEIGHT); 70 | layerY.backgroundColor = [[UIColor colorFromHexCode:@"d8d8d8"] CGColor]; 71 | [self.layer addSublayer:layerY]; 72 | 73 | float height= 30; 74 | // 纵坐标上的横线 75 | for (int i=0; i<5; i++) { 76 | if (i!=5) { 77 | CAShapeLayer *layer5 = [CAShapeLayer layer]; 78 | layer5.frame = CGRectMake(0, i*height,LABLE_WIDTH, 0.5f); 79 | layer5.backgroundColor = [[UIColor colorFromHexCode:@"d8d8d8"] CGColor]; 80 | [layerY addSublayer:layer5]; 81 | } 82 | } 83 | 84 | // 右侧侧纵轴线 85 | CAShapeLayer *layerLeft = [CAShapeLayer layer]; 86 | layerLeft.frame = CGRectMake(VIEW_WIDTH-2,25, 0.5f, LABLE_HEIGHT); 87 | layerLeft.backgroundColor = [[UIColor colorFromHexCode:@"d8d8d8"] CGColor]; 88 | [self.layer addSublayer:layerLeft]; 89 | 90 | } 91 | 92 | -(void)makeBottomlayer{ 93 | 94 | _bottomLayer = [CAShapeLayer layer]; 95 | _bottomLayer.backgroundColor = [UIColor clearColor].CGColor; 96 | _bottomLayer.frame = CGRectMake(0, 0, VIEW_WIDTH, VIEW_HEIGHT); 97 | [self.layer addSublayer:_bottomLayer]; 98 | } 99 | -(void)setArrX:(NSArray *)arrX{ 100 | _arrX = arrX; 101 | 102 | [layerX removeFromSuperlayer]; 103 | [self makeChartXView]; 104 | 105 | CGFloat width = (VIEW_WIDTH-30)/3; 106 | 107 | for (NSInteger i=0; i