Android画折线图、柱状图、饼图（使用achartengine.jar）

我就是我 2022-08-21 04:08 248阅读 0赞

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

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

--------------------

# 所需要的jar包：achartengine.jar #

下载地址：[http://download.csdn.net/detail/zhengyikuangge/9460642][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][http_download.csdn.net_detail_zhengyikuangge_9517499]

[http_download.csdn.net_detail_zhengyikuangge_9460642]: http://download.csdn.net/detail/zhengyikuangge/9460642
[http_download.csdn.net_detail_zhengyikuangge_9517499]: http://download.csdn.net/detail/zhengyikuangge/9517499