IOS_使用CorePlot实现曲线图(可交互)

本文是来自本群【小七_IOS_太原】的力作,感谢小七的分享

看上这位技术达人可以联系Email:[email protected]


最明显的地方附上Demo下载地址


工程目录结构:

IOS_使用CorePlot实现曲线图(可交互)_第1张图片


代码运行效果如下:

IOS_使用CorePlot实现曲线图(可交互)_第2张图片


核心代码:

  CPTXYPlotSpace *plotSpace = (CPTXYPlotSpace *) self.graph.defaultPlotSpace;
    // 创建坐标轴
    CPTXYAxisSet *axisSet = (CPTXYAxisSet *)self.graph.axisSet;
    CPTXYAxis *x          = axisSet.xAxis;
    {
        x.labelingPolicy=CPTAxisLabelingPolicyAutomatic;  //自动计算拖动后的 刻度
        x.orthogonalCoordinateDecimal=CPTDecimalFromInt(0); //从0开始 即:交叉点
        x.minorTicksPerInterval=4;  //一个大的间隔里有几个小的间隔
        //x.majorIntervalLength         = CPTDecimalFromInteger(1); // 因为用了自动计算 所以这个不起作用 这个代表一个大的间隔的值
        x.majorGridLineStyle = self.majorGridLineStyle;
        //x轴 显示到指定的刻度
        x.visibleRange   = [CPTPlotRange plotRangeWithLocation:CPTDecimalFromFloat(0.0f) length:CPTDecimalFromFloat(25.0f)];
        x.gridLinesRange = [CPTPlotRange plotRangeWithLocation:CPTDecimalFromFloat(0.0f) length:CPTDecimalFromFloat(15.0f)];
        //        设置x轴格式化
        //        LabelNumberFormatter *labelFormatter=[[LabelNumberFormatter alloc]init];
        //        [labelFormatter setChartData:self.chartData];
        //        x.labelFormatter = labelFormatter;
        x.labelFormatter=self.defaultNumberFormat;
        x.labelTextStyle = titleTextStyle;
        x.plotSpace = plotSpace;
    }
    
    CPTXYAxis *y = axisSet.yAxis;
    {
        y.majorIntervalLength         = CPTDecimalFromFloat(1.0f);
        y.minorTicksPerInterval       = 0;
        y.orthogonalCoordinateDecimal = CPTDecimalFromFloat(-1.0f);
        y.majorGridLineStyle          = self.majorGridLineStyle;
        y.visibleRange   = [CPTPlotRange plotRangeWithLocation:CPTDecimalFromFloat(0.0f) length:CPTDecimalFromFloat(15.0f)];
        y.gridLinesRange = [CPTPlotRange plotRangeWithLocation:CPTDecimalFromFloat(-1.0f) length:CPTDecimalFromFloat(25.0f)];
        
        y.labelFormatter=self.defaultNumberFormat;
        y.labelTextStyle = titleTextStyle;
        y.plotSpace = plotSpace;
    }
    //添加 x/y 轴
    self.graph.axisSet.axes = @[x,y];
    
    // 创建折线样式
    CPTMutableLineStyle *lineStyle = [[CPTMutableLineStyle alloc] init];
    lineStyle.lineWidth              = 2.0;
    lineStyle.lineColor              = [CPTColor greenColor];
    
    //创建折线
    CPTScatterPlot *plot =[self addScatterPlot:@"coreplot simple" lineStyle:lineStyle dataSource:self];
    //设置填充颜色
    CPTColor *areaColor       = [CPTColor colorWithComponentRed:1.0 green:1.0 blue:1.0 alpha:0.6];
    CPTGradient *areaGradient = [CPTGradient gradientWithBeginningColor:areaColor endingColor:[CPTColor clearColor]];
    areaGradient.angle = -90.0f;
    CPTFill *areaGradientFill = [CPTFill fillWithGradient:areaGradient];
    plot.areaFill      = areaGradientFill;
    plot.areaBaseValue = CPTDecimalFromDouble(0.0);
    
    // 添加折线点的提示 就是蓝色的小点点
    CPTMutableLineStyle *symbolLineStyle = [CPTMutableLineStyle lineStyle];
    symbolLineStyle.lineColor = [[CPTColor blackColor] colorWithAlphaComponent:0.5];
    CPTPlotSymbol *plotSymbol = [CPTPlotSymbol ellipsePlotSymbol];
    plotSymbol.fill               = [CPTFill fillWithColor:[[CPTColor blueColor] colorWithAlphaComponent:0.5]];
    plotSymbol.lineStyle          = symbolLineStyle;
    plotSymbol.size               = CGSizeMake(8.0, 8.0);
    plot.plotSymbol = plotSymbol;
    
    //设置范围: 比如y轴 从-1开始显示到15
    plotSpace.yRange = [CPTPlotRange plotRangeWithLocation:CPTDecimalFromFloat(-1.0f) length:CPTDecimalFromFloat(15.0f)];
    plotSpace.xRange = [CPTPlotRange plotRangeWithLocation:CPTDecimalFromFloat(-2.0f) length:CPTDecimalFromFloat(25.0f)];
    
    //添加触摸功能
    [self addTouchPlot:view];
    
     // 添加图例
    self.graph.legendAnchor=CPTRectAnchorBottomLeft;  //位置
    self.graph.legendDisplacement = CGPointMake(50.0,3.0);
    [self addLegend:@[plot]];
    
    //黑色的长条
    UIView *swipeTitleView=[[UIView alloc]initWithFrame:CGRectMake(self.graph.plotAreaFrame.paddingLeft+20, self.graph.plotAreaFrame.paddingTop+5, ScreenHeight-self.graph.plotAreaFrame.paddingLeft-self.graph.plotAreaFrame.paddingRight-20, 8)];
    [swipeTitleView setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:@"zsbj"]]];
    [view addSubview:swipeTitleView];
    
    //滑动的button
    UIButton * swipeBtn=[UIButton buttonWithType:UIButtonTypeCustom];
    [swipeBtn setBackgroundImage:[UIImage imageNamed:@"button_bj"] forState:UIControlStateNormal];
    [swipeBtn setFrame:CGRectMake(ScreenHeight/2-25, self.graph.plotAreaFrame.paddingTop, 100, 20)];
    [swipeBtn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [swipeBtn.titleLabel setTextColor:[UIColor blackColor]];
    [swipeBtn.titleLabel setFont:[UIFont boldSystemFontOfSize:13]];
    [swipeBtn setHidden:YES];
    [view addSubview:swipeBtn];
    self.swipeButton=swipeBtn;



小编:

里面的交互写的比较细,可以好好看下,与一般的初级使用corePlot不同



你可能感兴趣的:(IOS技术)