ios 畫圖,繪製座標系,畫座標系
先來看個效果:
建立視圖類,在直接添加代碼:
// Only override drawRect: if you perform custom drawing.// An empty implementation adversely affects performance during animation.- (void)drawRect:(CGRect)rect{ // 擷取當前環境 CGContextRef context = UIGraphicsGetCurrentContext(); // 儲存當前環境,便於以後恢複 CGContextSaveGState(context); // 把資料群組織起來 for (int i = 0; i < self.dataArray.count; i++) { NSString * x_data = self.dataArray[i][@xxx]; NSString * y_data = self.dataArray[i][@yyyy]; NSString * rate_data = self.dataArray[i][@rrr]; [x_array addObject:x_data]; [y_array addObject:y_data]; [rate_array addObject:rate_data]; } // 矩形畫圖地區 CGRect Rectangle = rect; // 定義一個矩形路徑 UIBezierPath *path = [UIBezierPath bezierPathWithRect:Rectangle]; // 將矩形路徑畫出來 [path stroke]; ///////////////////////////////////////////////////////////////// // 公用資料 float fdistance_left_frame = 30.0; // 左側X軸距離邊框的寬度,用於繪製文本 float fdistance_bottom_frame = 15.0; // 左側Y軸距離邊框的寬度 float fdistance_right_frame = 10.0; // 左側X軸距離邊框的寬度 float fdraw_line_height = rect.size.height - fdistance_bottom_frame; // 繪製座標的高度 float fdraw_line_width = rect.size.width - fdistance_left_frame - fdistance_right_frame; // 繪製座標的寬度 float f_x_axis_scale_number = 7.0; // X軸大刻度數 float f_y_axis_scale_number = 7.0; // Y軸刻度數 float x_unit_distance_scale = 0.0; // X軸刻度的位移量 float y_unit_distance_scale = 0.0; // Y軸刻度的位移量 float x_unit_scale = 0.0; // X軸刻度的跨度(一個比例單元) float y_unit_scale = 0.0; // Y軸刻度的跨度(一個比例單元) // 開始畫X軸 float left_bottom_x = rect.origin.x + fdistance_left_frame; float left_bottom_y = rect.origin.y + fdraw_line_height; CGPoint point_origin = CGPointMake(left_bottom_x, left_bottom_y); // 座標軸原點 // 定義一個開始路徑 UIBezierPath * x_startPath = [UIBezierPath bezierPath]; [x_startPath setLineWidth:1.5]; [x_startPath moveToPoint:point_origin]; // 設定起點(座標原點) for (int x = 0; x < f_x_axis_scale_number; x++) // 畫直線 { x_unit_scale = fdraw_line_height/f_x_axis_scale_number; // 一級等分大刻度 x_unit_distance_scale = x * x_unit_scale; // 相對原點的位移點 [x_startPath addLineToPoint:CGPointMake(left_bottom_x, left_bottom_y - x_unit_distance_scale)]; // “|”X軸左側繪製文本 float text_height_certer = left_bottom_y; float text_rect_top = text_height_certer - 8 - x_unit_distance_scale; float text_rect_bottom = text_height_certer + 8 - x_unit_distance_scale; // +8 -8 ,給文字16個像素的高度 float text_rect_height = 16; CGRect x_axis_rect = CGRectMake(2, text_rect_top, fdistance_left_frame, text_rect_height); CGContextSetLineWidth(context, 1.0); CGContextSetRGBFillColor (context, 0.5, 0.5, 0.5, 0.5); UIFont *font = [UIFont boldSystemFontOfSize:12.0]; // 字型用12號 NSString * x_strtext = [NSString stringWithFormat:@%zi.00,x]; // 繪製X軸刻度值 [x_strtext drawInRect:x_axis_rect withFont:font]; if (0 == x) {// 為“0”時,不或那個繪製刻度,直接在底部繪製橫線“Y”軸 float y_width = fdraw_line_width; CGContextSetRGBStrokeColor(context, 0.5, 0.5, 0.5, 0.5);//線條顏色 CGContextMoveToPoint(context, left_bottom_x, left_bottom_y - x_unit_distance_scale); CGContextAddLineToPoint(context, left_bottom_x + y_width, left_bottom_y - x_unit_distance_scale); CGContextStrokePath(context); // 開始畫Y軸 UIBezierPath * y_startPath = [UIBezierPath bezierPath]; [y_startPath setLineWidth:1.5]; [y_startPath moveToPoint:point_origin]; // Y軸的起始點也是X軸的刻度起始點 for (int y = 0; y < f_y_axis_scale_number + 1; y++) // 畫直線 { y_unit_scale = fdraw_line_width/f_y_axis_scale_number; // 一級等分大刻度 y_unit_distance_scale = y * y_unit_scale; // 相對原點的位移點 [y_startPath addLineToPoint:CGPointMake(left_bottom_x, left_bottom_y - x_unit_distance_scale)]; // “—”Y軸下部繪製文本 float y_text_left_certer = left_bottom_x; float y_text_rect_left = y_text_left_certer - 15 + y_unit_distance_scale; float y_text_rect_top = left_bottom_y + 2; float y_text_rect_width = y_text_left_certer + 15 + y_unit_distance_scale; // +10 -10 ,給文字20個像素的寬度 float y_text_rect_height = 16; CGRect y_axis_rect = CGRectMake(y_text_rect_left, y_text_rect_top, y_text_rect_width, y_text_rect_height); CGContextSetLineWidth(context, 1.5); // 線寬度 CGContextSetRGBFillColor (context, 0.5, 0.5, 0.5, 0.5); UIFont *font = [UIFont boldSystemFontOfSize:12.0]; // 字型用12號// NSString * y_strtext = [NSString stringWithFormat:@%zi.00,y];// 繪製Y軸刻度值 NSString * y_strtext = [y_array objectAtIndex:f_y_axis_scale_number - y]; y_strtext = [y_strtext substringFromIndex:5]; // 繪製Y軸刻度值 [y_strtext drawInRect:y_axis_rect withFont:font]; if (y == 0){ } else { // “—”Y軸上部繪製刻度短線 float fscale_width = 5.0; CGContextSetRGBStrokeColor(context, 0.5, 0.5, 0.5, 0.5); // 線條顏色 CGContextMoveToPoint(context, left_bottom_x + y_unit_distance_scale, left_bottom_y ); CGContextAddLineToPoint(context, left_bottom_x + y_unit_distance_scale, left_bottom_y - fscale_width); CGContextStrokePath(context); } } [y_startPath stroke]; // Draws line 根據座標點連線 } else { // |X軸繪製右側刻度短線 float fscale_width = 5.0; CGContextSetRGBStrokeColor(context, 0.5, 0.5, 0.5, 0.5);// 線條顏色 CGContextMoveToPoint(context, left_bottom_x, left_bottom_y - x_unit_distance_scale); CGContextAddLineToPoint(context, left_bottom_x + fscale_width, left_bottom_y - x_unit_distance_scale); CGContextStrokePath(context); }// // 繪製二級小刻度值// for (int xx = 0; xx < 5; xx++)// {// float fsmall_scale_width = 3.0;// CGContextSetRGBStrokeColor(context, 0.5, 0.5, 0.5, 0.5);// 線條顏色// CGContextSetLineWidth(context, 1.0); // 線寬度// float fsmall_scale_height = x_unit_distance_scale/10.0; // 每一小刻度 的高度不變// CGContextMoveToPoint(context, point_origin.x, point_origin.y - fsmall_scale_height);// CGContextAddLineToPoint(context, point_origin.x + fsmall_scale_width, point_origin.y - fsmall_scale_height);// CGContextStrokePath(context);// } } [x_startPath stroke]; // Draws line 根據座標點連線 [[UIColor blueColor] setFill]; [x_startPath fill]; // |X軸繪製虛線,橫向虛線 CGFloat dashArray[] = {2.0, 2.0}; CGContextSetLineDash(context, 0, dashArray, 2); CGContextSetRGBStrokeColor(context,0.5, 0.5, 0.5, 0.5);// 線條顏色 for (int x = 1; x < f_x_axis_scale_number + 1; x++) // 畫虛線 { x_unit_distance_scale = x * (x_unit_scale); // 一級等分大刻度 CGContextMoveToPoint(context, left_bottom_x + 5, left_bottom_y - x_unit_distance_scale); CGContextAddLineToPoint(context, left_bottom_x + fdraw_line_width, left_bottom_y - x_unit_distance_scale); } for (int y = 1; y < f_y_axis_scale_number + 1; y++) // 畫虛線 { y_unit_distance_scale = y * (y_unit_scale); // 一級等分大刻度 CGContextMoveToPoint(context, point_origin.x + y_unit_distance_scale, point_origin.y - 5); CGContextAddLineToPoint(context, point_origin.x + y_unit_distance_scale, point_origin.y - fdraw_line_height + fdistance_bottom_frame + 3); } CGContextStrokePath(context); // 開始繪製曲線圖 CGContextSetLineDash(context, 0.0,NULL, 0); // 還原畫筆 CGContextSetLineWidth(context,1.0); // 設定為實線畫筆 CGContextSetRGBStrokeColor(context, 1.0, 0, 0, 0.5); // 線條顏色 for (int a = 0; a < x_array.count; a++) { // Y軸日期倒著遍曆,這裡資料也倒著遍曆 float fdata = [[x_array objectAtIndex: x_array.count-1 - a] floatValue]; CGPoint data_point = CGPointMake(point_origin.x + a * y_unit_scale, point_origin.y - fdata * x_unit_scale); // 座標軸原點 if (0 == a) { CGContextMoveToPoint(context, data_point.x, data_point.y); } else { CGContextAddLineToPoint(context, data_point.x, data_point.y); } NSLog(@%zi == (%f, %f), a, data_point.x, data_point.y); } CGContextStrokePath(context); // 開始邊框圓點 CGContextSetRGBStrokeColor(context, 1.0, 0.0, 0.0, 1.0);//畫筆線的顏色 CGContextSetLineWidth(context, 2.0);//線的寬度 //void CGContextAddArc(CGContextRef c,CGFloat x, CGFloat y,CGFloat radius,CGFloat startAngle,CGFloat endAngle, int clockwise)1弧度=180°/π (≈57.3°) 度=弧度×180°/π 360°=360×π/180 =2π 弧度 // x,y為圓點座標,radius半徑,startAngle為開始的弧度,endAngle為 結束的弧度,clockwise 0為順時針,1為逆時針。 for (int a = 0; a < x_array.count; a++) { // Y軸日期倒著遍曆,這裡資料也倒著遍曆 float fdata = [[x_array objectAtIndex: x_array.count-1 - a] floatValue]; CGPoint data_point = CGPointMake(point_origin.x + a * y_unit_scale, point_origin.y - fdata * x_unit_scale); // 座標軸原點 CGContextAddArc(context, data_point.x, data_point.y, 1, 0, 2 * PI, 0); //添加一個圓 } CGContextDrawPath(context, kCGPathStroke); //繪製路徑}Bible 2015-07-15 17:24:10 // 檔案頭部添加 宏定義#define PI 3.1415926