android 绘制柱状图等

本文介绍了如何在Android中使用ChartView库进行柱状图的绘制。通过调用特定的API并参考相关教程,实现了自定义柱状图的功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

package com.yx.palmrec.util;

import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Point;

public abstract class Chart {
	protected Point mOri; // 原点坐标
	protected String [] mXLabels;
	protected int mYScales = 10; // Y的刻度个数
	protected int mXLength = 380; // X轴的长度
	protected int mYLength = 240; // Y轴的长度
	protected double [] mData; // 数据
	protected String mTitle;    //显示的标题
	protected Paint mPaint;
	private boolean mInitInfo = false; //设置初始化数据后才显示
    
	public Chart() {
		mPaint = new Paint();
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setAntiAlias(true);//去锯齿
        mPaint.setColor(Color.GREEN);//颜色
        mPaint.setTextSize(12);  //设置轴文字大小
	}
		
	/*****************************************************************
	 * 设置X,Y轴的长度和刻度(单位:像素)
	 * @param ori 原点坐标
	 * @param xLen X轴的长度
	 * @param xLabels X轴显示的刻度值
	 * @param yLen  Y轴的长度
	 * @param yScaleSize Y轴的刻度数(就是要显示多少个刻度,而每个刻度的具体数值是通过传入的数据计算出来的)
	 */
	public void initAxis(Point ori,int xLen,String [] xLabels,int yLen,int yScaleSize,String title){
        this.mOri   = ori;
		this.mXLength  = xLen;
        this.mXLabels  = xLabels;
        this.mYLength  = yLen;
        this.mYScales  = yScaleSize;
        this.mTitle = title;
	}
	
	public void setData(double[] data)
    {
        mData = data;
        mInitInfo = true;
    }

    public void draw(Canvas canvas){
        if(!mInitInfo)
        	return;
        drawAsix(canvas);
        drawData(canvas);
    }
    
    protected void drawAsix(Canvas canvas){

        //canvas.drawColor(Color.WHITE);//设置背景颜色        
        
        double maxData = 0.0;
        for(int i=0; i<mData.length; ++i)
        	maxData = (mData[i]>maxData)?mData[i]:maxData;
        
        //设置Y轴
        int yScaleLen = mYLength/mYScales;
        canvas.drawLine(mOri.x, mOri.y-mYLength, mOri.x, mOri.y, mPaint);   //轴线
        for(int i=0; i<mYScales ;i++)                
        {
            canvas.drawLine(mOri.x,mOri.y-i*yScaleLen, mOri.x+5, mOri.y-i*yScaleLen, mPaint);  //刻度
            //drawText的是以mData元素换算的刻度
            canvas.drawText(String.format("%.1f", i*maxData/mYScales) , mOri.x-40, mOri.y-i*yScaleLen+5, mPaint);  //文字
        }
        canvas.drawText(String.format("%.1f", maxData) , mOri.x-40, mOri.y-mYLength, mPaint);  //文字
        canvas.drawLine(mOri.x,mOri.y-mYLength,mOri.x-3,mOri.y-mYLength+6,mPaint);  //箭头
        canvas.drawLine(mOri.x,mOri.y-mYLength,mOri.x+3,mOri.y-mYLength+6,mPaint);            
       
        //设置X轴
        int XScaleLen = mXLength/mXLabels.length;
        canvas.drawLine(mOri.x,mOri.y,mOri.x+mXLength,mOri.y,mPaint);   //轴线
        for(int i=0;i<mXLabels.length;i++)    
        {
            canvas.drawLine(mOri.x+i*XScaleLen, mOri.y, mOri.x+i*XScaleLen, mOri.y-5, mPaint);  //刻度
            canvas.drawText(mXLabels[i] , mOri.x+i*XScaleLen-10, mOri.y+20, mPaint);  //文字
        }
        canvas.drawLine(mOri.x+mXLength,mOri.y,mOri.x+mXLength-6,mOri.y-3,mPaint);    //箭头
        canvas.drawLine(mOri.x+mXLength,mOri.y,mOri.x+mXLength-6,mOri.y+3,mPaint);  
        mPaint.setTextSize(16);
        canvas.drawText(mTitle, mXLength/2, mOri.y - mYLength, mPaint);
    }
    
    //可以在drawData自行实现以绘制柱状图,折线图,饼图等
    abstract protected void drawData(Canvas canvas);
}

实现的柱状图类:

package com.yx.palmrec.util;

import android.graphics.Canvas;

public class BarChart extends Chart {
	
	/**
	 * 绘制柱状图
	 */
    protected void drawData(Canvas canvas){
        double maxData = 0;
        for(int i=0; i<mData.length; ++i)
        	maxData = (mData[i]>maxData)?mData[i]:maxData;
        	
        int xEleLen = mXLength / mData.length; //每个数据元素所占的X像素长度	
    	for(int i=0; i<mData.length; ++i)
    	{
    		float left = mOri.x + i*xEleLen;
    		float top  = (float) (mOri.y - mYLength * mData[i] /maxData);
    		float right = left + xEleLen;
    		float bottom = mOri.y;
    		canvas.drawRect(left, top, right, bottom, mPaint);
    	}
    }
}


ChartView:

/** 2014-3-29
 * 
 */
package com.yx.palmrec;

import com.yx.palmrec.util.BarChart;

import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.View;

/**
 * @author PGP 2014-3-29 : 下午10:38:16
 *
 */
public class ChartView extends View {

	private BarChart [] barCharts;
	/**
	 * @param context
	 */
	public ChartView(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}

	/**
	 * @param context
	 * @param attrs
	 */
	public ChartView(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
	}

	/**
	 * @param context
	 * @param attrs
	 * @param defStyleAttr
	 */
	public ChartView(Context context, AttributeSet attrs, int defStyleAttr) {
		super(context, attrs, defStyleAttr);
		// TODO Auto-generated constructor stub
	}
	
	public void ShowCharts(BarChart [] charts){
		barCharts = charts;
		invalidate();
	}
	
	@Override
	protected void onDraw(Canvas canvas){
		super.onDraw(canvas);
		
		if(barCharts == null || barCharts.length<=0)
			return;
		
		for(int i=0; i<barCharts.length; ++i)
		{
			barCharts[i].draw(canvas);
		}
	}
}


调用片段:

		mChartView = (ChartView)findViewById(R.id.chartview);
		
		double [][] chartData = {{20.0,40.0,100.0,600.0,12.0,87.0}};
		String [][] XLables = {{"2001","2002","2003","2004","2005","2006"}};
		BarChart [] charts = new BarChart[1];
		for(int i=0; i<charts.length; ++i)
		{
			charts[i] = new BarChart();
			charts[i].initAxis(new Point(50,350), 300, XLables[i], 300, 10,"bar chart");
			charts[i].setData(chartData[i]);
		}
//一个view里可以显示多个图表
		mChartView.ShowChart(charts);



参考:http://blog.youkuaiyun.com/ygc973797893/article/details/7751962 我只是做了适量修改,以符合自己的需求,谢谢作者!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值