Android画折线图、柱状图、饼图(使用achartengine.jar)

来源:互联网 发布:mac 浅色文件夹打不开 编辑:程序博客网 时间:2024/05/17 08:53

From:http://bubufx.com/detail-1629050.html

原文:http://blog.csdn.net/zhengyikuangge/article/details/50884749

自从用了画折线的jar包之后,就不想再用canvas画布去画了,编程就是要站在巨人的肩膀上。

  • 所需要的jar包achartenginejar
  • 折线代码布局文件就不上传了很简单
    • 另一种线的渲染器
  • 扇形图代码
  • 柱状图代码
  • 属性总结部分代码
  • 新测试代码下载地址


所需要的jar包:achartengine.jar

下载地址:http://download.csdn.net/detail/zhengyikuangge/9460642


折线代码(布局文件就不上传了,很简单):

package com.example.chartest02;import java.text.SimpleDateFormat;import java.util.Date;import org.achartengine.ChartFactory;import org.achartengine.GraphicalView;import org.achartengine.chart.PointStyle;import org.achartengine.model.XYMultipleSeriesDataset;import org.achartengine.model.XYSeries;import org.achartengine.renderer.XYMultipleSeriesRenderer;import org.achartengine.renderer.XYSeriesRenderer;import android.app.Activity;import android.graphics.Color;import android.os.Bundle;import android.widget.LinearLayout;public class MainActivity extends Activity {    XYMultipleSeriesDataset mDataset;    // 多个系列的数据集合,即多条线的数据集合    XYSeries series;    // 一个系列的数据,即一条线的数据集合    XYMultipleSeriesRenderer mRenderer;    // 多个系列的环境渲染,即整个画折线的区域    XYSeriesRenderer r;    // 一个系列的环境渲染,即一条线的环境渲染    GraphicalView view;    // 整个view    int i = 5;    LinearLayout ll;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        ll = (LinearLayout) findViewById(R.id.ll);        lineView();        new Thread(new Runnable() {            @Override            public void run() {                // TODO Auto-generated method stub                while (true) {                    double d = Math.random() * 15;                    series.add(i, d);                    mRenderer.addXTextLabel(i, nowtime());                    //动态添加数据和标题                    view.repaint();                    //重绘折线                    i++;                    try {                        Thread.sleep(1000);                    } catch (InterruptedException e) {                        // TODO Auto-generated catch block                        e.printStackTrace();                    }                }            }        }).start();    }    public void lineView() {        // 同样是需要数据dataset和视图渲染器renderer        mDataset = new XYMultipleSeriesDataset();        series = new XYSeries("Frist");        series.add(1, 6);        series.add(2, 5);        series.add(3, 7);        series.add(4, 4);        mDataset.addSeries(series);        mRenderer = new XYMultipleSeriesRenderer();        mRenderer                .setOrientation(XYMultipleSeriesRenderer.Orientation.HORIZONTAL);        // 设置图表的X轴的当前方向        mRenderer.setXTitle("X轴");// 设置为X轴的标题        mRenderer.setYTitle("Y轴");// 设置y轴的标题        mRenderer.setAxisTitleTextSize(20);// 设置轴标题文本大小        mRenderer.setChartTitle("ChartTest");// 设置图表标题        mRenderer.setChartTitleTextSize(30);// 设置图表标题文字的大小        mRenderer.setLabelsTextSize(18);// 设置标签的文字大小        mRenderer.setLegendTextSize(20);// 设置图例文本大小        mRenderer.setPointSize(10f);// 设置点的大小        mRenderer.setYAxisMin(0);// 设置y轴最小值是0        mRenderer.setYAxisMax(15);        mRenderer.setYLabels(10);// 设置Y轴刻度个数(貌似不太准确)        mRenderer.setXAxisMax(5);//设置X轴坐标个数        // 将x标签栏目显示如:1,2,3,4替换为显示1月,2月,3月,4月        mRenderer.addXTextLabel(1, "1月");        mRenderer.addXTextLabel(2, "2月");        mRenderer.addXTextLabel(3, "3月");        mRenderer.addXTextLabel(4, "4月");        mRenderer.setXLabels(0);// 设置只显示如1月,2月等替换后的东西,不显示1,2,3等        mRenderer.setMargins(new int[] { 20, 30, 15, 20 });// 设置视图位置        mRenderer.setPanEnabled(true, false);        // 第一个参数设置X轴是否可滑动,第二个参数设置Y轴是够可滑动        r = new XYSeriesRenderer();        r.setColor(Color.BLUE);// 设置颜色        r.setPointStyle(PointStyle.CIRCLE);// 设置点的样式        r.setFillPoints(true);// 填充点(显示的点是空心还是实心)        r.setDisplayChartValues(true);// 将点的值显示出来        r.setChartValuesSpacing(10);// 显示的点的值与图的距离        r.setChartValuesTextSize(25);// 点的值的文字大小        // r.setFillBelowLine(true);//是否填充折线图的下方        // r.setFillBelowLineColor(Color.GREEN);//填充的颜色,如果不设置就默认与线的        //颜色一致        r.setLineWidth(3);// 设置线宽        mRenderer.addSeriesRenderer(r);        view = ChartFactory.getLineChartView(this, mDataset, mRenderer);        view.setBackgroundColor(Color.BLACK);        ll.addView(view);        //将画好折线的view添加到xml中的一个布局里    }    private String nowtime() {    //求当前系统的时分秒        SimpleDateFormat format = new SimpleDateFormat("HH:mm:ss");        return format.format(new Date());    }}

我现在一直想实现的是:x轴可以跟着移动起来,但是一直找不到合适的办法,网上说改x轴的最大值,但效果并不理想,待定。。。


另一种线的渲染器:

ColoursXYSeriesRenderer rendererMajor = new ColoursXYSeriesRenderer();rendererMajor.setPointStyle(PointStyle.CIRCLE);// 设置为曲线图rendererMajor.setFillPoints(true);// 数据点被填充rendererMajor.setDisplayChartValues(true);// 在图表中显示点的值rendererMajor.setDisplayChartValuesDistance(1);// 在X轴上,设置两点之间的距离rendererMajor.setColor(Color.WHITE);// 设置线的颜色rendererMajor.setChartValuesTextSize(25);// 设置点值文本的尺寸大小rendererMajor.setChartValuesSpacing(15f);// 实时数据文本到中心点的间距rendererMajor.setUseColor(true);// 设置当前为双色曲线图rendererMajor.setPointColor(Color.GREEN);// 设置点的颜色rendererMajor.setChartValueTextColor(Color.WHITE);// 设置数值文本的颜色rendererMajor.setWarningMinValue(0);// 设置告警最小值,新属性rendererMajor.setWarningMaxValue(5);// 设置告警最大值,新属性

扇形图代码:

public class PieChartBuilder extends Activity {    private GraphicalView mChartView;//显示PieChart    private LinearLayout mLinear;//布局方式    // public void back(View v) {    // Log.i("qiuzhping", "back onClick");    // Intent intent = new Intent();    // intent.setClass(PieChartBuilder.this, MainActivity.class);    // startActivity(intent);    // PieChartBuilder.this.finish();    // }    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.xy_chart);        mLinear = (LinearLayout) findViewById(R.id.chart);        mLinear.setBackgroundColor(Color.BLACK);        if (mChartView == null) {// 为空需要从ChartFactory获取PieChartView            int[] COLORS = new int[] { Color.RED, Color.GREEN, Color.BLUE,                    Color.MAGENTA, Color.CYAN, Color.YELLOW, Color.DKGRAY };            double data[] = new double[] { 20, 30, 40, 50, 60, 70, 80, 90, 100 };            final CategorySeries mSeries = new CategorySeries("");            final DefaultRenderer mRenderer = new DefaultRenderer();            double VALUE = 0;// 总数            mRenderer.setZoomButtonsVisible(true);// 显示放大缩小功能按钮            mRenderer.setStartAngle(180);// 设置为水平开始            mRenderer.setDisplayValues(true);// 显示数据            mRenderer.setFitLegend(true);// 设置是否显示图例            mRenderer.setLegendTextSize(10);// 设置图例字体大小            mRenderer.setLegendHeight(10);// 设置图例高度            mRenderer.setChartTitle("饼图示例");// 设置饼图标题            for (int i = 0; i < data.length; i++)                VALUE += data[i];            for (int i = 0; i < data.length; i++) {            /*这里是重点,只要把数值/总值赋给mSeries,它就可以自动生成每一部分*/                mSeries.add("示例 " + (i + 1), data[i] / VALUE);// 设置种类名称和对应的数值,前面是(key,value)键值对                SimpleSeriesRenderer renderer = new SimpleSeriesRenderer();                if (i < COLORS.length) {                    renderer.setColor(COLORS[i]);// 设置描绘器的颜色                } else {                    renderer.setColor(getRandomColor());// 设置描绘器的颜色                }                renderer.setChartValuesFormat(NumberFormat.getPercentInstance());// 设置百分比                mRenderer.setChartTitleTextSize(14);// 设置饼图标题大小                mRenderer.addSeriesRenderer(renderer);// 将最新的描绘器添加到DefaultRenderer中            }            mChartView = ChartFactory.getPieChartView(getApplicationContext(),                    mSeries, mRenderer);// 构建mChartView            mRenderer.setClickEnabled(true);// 允许点击事件            mChartView.setOnClickListener(new View.OnClickListener() {// 具体内容                        @Override                        public void onClick(View v) {                            SeriesSelection seriesSelection = mChartView                                    .getCurrentSeriesAndPoint();// 获取当前的类别和指针                            if (seriesSelection == null) {                                Toast.makeText(getApplicationContext(),                                        "您未选择数据", Toast.LENGTH_SHORT).show();                            } else {                                for (int i = 0; i < mSeries.getItemCount(); i++) {                                    mRenderer.getSeriesRendererAt(i)                                            .setHighlighted(                                                    i == seriesSelection                                                            .getPointIndex());                                }                                mChartView.repaint();                                Toast.makeText(                                        getApplicationContext(),                                        "您选择的是第"                                                + (seriesSelection                                                        .getPointIndex() + 1)                                                + " 项 "                                                + " 百分比为  "                                                + NumberFormat                                                        .getPercentInstance()                                                        .format(seriesSelection                                                                .getValue()),                                        Toast.LENGTH_SHORT).show();                            }                        }                    });            mLinear.addView(mChartView, new LayoutParams(                    LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));        } else {            mChartView.repaint();        }    }    private int getRandomColor() {// 分别产生RBG数值        Random random = new Random();        int R = random.nextInt(255);        int G = random.nextInt(255);        int B = random.nextInt(255);        return Color.rgb(R, G, B);    }}

柱状图代码

public class BarChartBuilder extends Activity {    private GraphicalView mChartView;    // public void back(View v) {    // Log.i("qiuzhping", "back onClick");    // Intent intent = new Intent();    // intent.setClass(BarChartBuilder.this, MainActivity.class);    // startActivity(intent);    // BarChartBuilder.this.finish();    // }    protected void setChartSettings(XYMultipleSeriesRenderer renderer,            String title, String xTitle, String yTitle, double xMin,            double xMax, double yMin, double yMax, int axesColor,            int labelsColor) {        renderer.setChartTitle(title);        renderer.setXTitle(xTitle);        renderer.setYTitle(yTitle);        renderer.setXAxisMin(xMin);        renderer.setXAxisMax(xMax);        renderer.setYAxisMin(yMin);        renderer.setYAxisMax(yMax);        renderer.setAxesColor(axesColor);        renderer.setLabelsColor(labelsColor);    }    protected XYMultipleSeriesRenderer buildBarRenderer(int[] colors) {        XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();        renderer.setAxisTitleTextSize(16);        renderer.setChartTitleTextSize(20);        renderer.setLabelsTextSize(15);        renderer.setLegendTextSize(15);        int length = colors.length;        for (int i = 0; i < length; i++) {            SimpleSeriesRenderer r = new SimpleSeriesRenderer();            r.setColor(colors[i]);            renderer.addSeriesRenderer(r);        }        return renderer;    }    protected XYMultipleSeriesDataset buildBarDataset(String[] titles,            List<double[]> values) {//柱形图的数据源和饼图差不多,也是由一些键值对组成        XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();        int length = titles.length;        for (int i = 0; i < length; i++) {            CategorySeries series = new CategorySeries(titles[i]);            double[] v = values.get(i);            int seriesLength = v.length;            for (int k = 0; k < seriesLength; k++) {                series.add(v[k]);            }            dataset.addSeries(series.toXYSeries());        }        return dataset;    }    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.xy_chart);        LinearLayout mLinear = (LinearLayout) findViewById(R.id.chart);        mLinear.setBackgroundColor(Color.BLACK);        String[] titles = new String[] { "2012", "2013" };        List<double[]> values = new ArrayList<double[]>();        values.add(new double[] { 1423, 1230, 1424, 1524, 1590, 1920, 2203,                2120, 1950, 1550, 1260, 1400 });        values.add(new double[] { 523, 730, 924, 1054, 790, 920, 1200, 1100,                950, 1500, 1100, 1500 });        int[] colors = new int[] { Color.RED, Color.BLUE };        XYMultipleSeriesRenderer renderer = buildBarRenderer(colors);// 柱形图颜色设置        setChartSettings(renderer, "柱形图示例", "月份", "数量", 0.5, 12.5, 0, 2400,                Color.GRAY, Color.LTGRAY);// 设置柱形图标题,横轴(X轴)、纵轴(Y轴)、最小的伸所刻度、最大的伸所刻度        renderer.getSeriesRendererAt(0).setDisplayChartValues(true);// 在第0条柱形图上显示数据        renderer.getSeriesRendererAt(1).setDisplayChartValues(true);// 在第1条柱形图上显示数据        renderer.setXLabels(12);        renderer.setYLabels(10);        renderer.setXLabelsAlign(Align.LEFT);// 数据从左到右显示        renderer.setYLabelsAlign(Align.LEFT);        renderer.setPanEnabled(true, false);        renderer.setZoomEnabled(true);        renderer.setZoomButtonsVisible(true);// 显示放大缩小功能按钮        renderer.setZoomRate(1.1f);        renderer.setBarSpacing(0.5f);// 柱形图间隔        if (mChartView == null) {// 构建柱形图            mChartView = ChartFactory.getBarChartView(getApplicationContext(),                    buildBarDataset(titles, values), renderer, Type.DEFAULT);            renderer.setClickEnabled(true);            //renderer.set            mLinear.addView(mChartView, new LayoutParams(                    LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));        } else            mChartView.repaint();    }}

属性总结(部分代码):

mRenderer = new XYMultipleSeriesRenderer();        renderer = new ColoursXYSeriesRenderer();        series = new XYSeries("FF");        //线的名称        dataset = new XYMultipleSeriesDataset();        series.add(0, 10);        series.add(1, 10);        // series 添加数据点,第一个参数为x轴坐标,0代表原点;第二个参数为Y轴坐标        dataset.addSeries(series);        renderer.setDisplayChartValues(true);// 是否显示数据        renderer.setPointStyle(PointStyle.CIRCLE);// 点的样式        renderer.setWarningMaxValue(300);// 最大警告值        renderer.setFillPoints(true);// 是否填充点        renderer.setColor(Color.BLACK);// 设置线的颜色        renderer.setUseColor(true);// 是否用双色        renderer.setLineWidth(8f);// 设置线的宽度        renderer.setChartValuesTextSize(25f);// 线值字的大小        renderer.setChartValueTextColor(Color.GREEN); // 折线值的颜色        renderer.setChartValuesSpacing(20f);// 值到线的举例        mRenderer.setOrientation(Orientation.HORIZONTAL);// 设置总方向        mRenderer.setXAxisMax(5);// X轴最大坐标数        mRenderer.setXLabels(0);// X轴不显示默认自带的坐标        mRenderer.setYAxisMax(500);// Y轴最大数值为500        mRenderer.setYAxisMin(0);// Y轴最小数值为0        mRenderer.setYLabels(5);// Y轴坐标为5个        mRenderer.setXLabelsColor(Color.BLACK);        mRenderer.setYLabelsColor(0, Color.BLACK);        mRenderer.setLabelsTextSize(25f);// 标签的颜色        mRenderer.setChartTitle("Test");// 设置图标的标题        mRenderer.setDisplayValues(true);// 是否显示数据        mRenderer.setPanEnabled(false, false);// 第一个参数为X轴不可滑动,第二个参数为X轴不可滑动        mRenderer.setPointSize(15f);// 点的大小        mRenderer.addSeriesRenderer(renderer);        view_test = ChartFactory.getLineChartView(context, dataset, mRenderer);        // 设置背景颜色一定要在生成View之后再设置        mRenderer.setApplyBackgroundColor(true);        // 是否应用背景颜色        mRenderer.setBackgroundColor(Color.TRANSPARENT);        // 设置背景颜色为透明        mRenderer.setMarginsColor(Color.TRANSPARENT);        // 设置图表之外的背景颜色为透明

新测试代码下载地址:

http://download.csdn.net/detail/zhengyikuangge/9517499

0 0