zoukankan      html  css  js  c++  java
  • Android报表库aChartEngine系列(line chart)

     

    前言:

      这几天本来打算对achartengine进行一些比较全面的讲解,不过考虑到它并不复杂,而且非常方便应用,加之官网提供了很好的demo不需要我们自己慢慢摸索。所以这将是aChartEngine库介绍的最后一篇文章了。在cnblogs上的阅读量上来看这方面的文章园友们并不是特别需要(毕竟简单嘛),但是为了保证aChartEngine介绍的完整性,还是坚持写完这最后一篇相关的介绍。如果有需要了解更多的朋友那么请自己参考官方教程。

    下面正式进入主题:

    1、line chart 介绍。

    aChartEngine中的line Chart是线图,是数据显示的一种。效果如图:

     上面的效果图并没有对线条进行平滑处理,当然你可以使用平滑的连线方式。具体内容请参见官方demo。

    2、如何使用line chart。

    line chart 的使用比起pie chart和stacked chart 都要复杂。个人觉得,这也是achartengine里面最复杂(相对而言)的报表显示方式。

    line chart和其他的报表组件一样,同样是需要数据dataset和视图渲染器renderer。数据需要的是一个坐标中的点(x,y)。除了数据格式和pie chart不同之外,renderer基本上一样。下面直接用一个demo演示一下它的使用方法。

    3、demo。  

    package com.example.test;
    
    import java.util.ArrayList;
    import java.util.List;
    
    import org.achartengine.ChartFactory;
    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.graphics.Paint.Align;
    import android.os.Bundle;
    import android.view.View;
    
    public class MainActivity extends Activity {
    
        @Override
        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            String[] titles = new String[] { "Crete", "Corfu", "Thassos", "Skiathos" };
            List<double[]> x = new ArrayList<double[]>();
            for (int i = 0; i < titles.length; i++) {
                x.add(new double[] { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12 });
            }
            List<double[]> values = new ArrayList<double[]>();
            values.add(new double[] { 12.3, 12.5, 13.8, 16.8, 20.4, 24.4, 26.4, 26.1, 23.6, 20.3, 17.2, 13.9 });
            values.add(new double[] { 10, 10, 12, 15, 20, 24, 26, 26, 23, 18, 14, 11 });
            values.add(new double[] { 5, 5.3, 8, 12, 17, 22, 24.2, 24, 19, 15, 9, 6 });
            values.add(new double[] { 9, 10, 11, 15, 19, 23, 26, 25, 22, 18, 13, 10 });
            int[] colors = new int[] { Color.BLUE, Color.GREEN, Color.CYAN, Color.YELLOW };
            PointStyle[] styles = new PointStyle[] { PointStyle.CIRCLE, PointStyle.DIAMOND, PointStyle.TRIANGLE, PointStyle.SQUARE };
            XYMultipleSeriesRenderer renderer = buildRenderer(colors, styles);
            int length = renderer.getSeriesRendererCount();
            for (int i = 0; i < length; i++) {
                ((XYSeriesRenderer) renderer.getSeriesRendererAt(i)).setFillPoints(true);
            }
            setChartSettings(renderer, "Average temperature", "Month", "Temperature", 0.5, 12.5, -10, 40, Color.LTGRAY, Color.LTGRAY);
            renderer.setXLabels(12);
            renderer.setYLabels(10);
            renderer.setShowGrid(true);
            renderer.setXLabelsAlign(Align.RIGHT);
            renderer.setYLabelsAlign(Align.RIGHT);
    
            renderer.setZoomButtonsVisible(true);
            renderer.setPanLimits(new double[] { -10, 20, -10, 40 });
            renderer.setZoomLimits(new double[] { -10, 20, -10, 40 });
    
            View view = ChartFactory.getLineChartView(this, buildDataset(titles, x, values), renderer);
            view.setBackgroundColor(Color.BLACK);
            setContentView(view);
        }
    
        private XYMultipleSeriesRenderer buildRenderer(int[] colors, PointStyle[] styles) {
            XYMultipleSeriesRenderer renderer = new XYMultipleSeriesRenderer();
            setRenderer(renderer, colors, styles);
            return renderer;
        }
    
        private void setRenderer(XYMultipleSeriesRenderer renderer, int[] colors, PointStyle[] styles) {
            renderer.setAxisTitleTextSize(16);
            renderer.setChartTitleTextSize(20);
            renderer.setLabelsTextSize(15);
            renderer.setLegendTextSize(15);
            renderer.setPointSize(5f);
            renderer.setMargins(new int[] { 20, 30, 15, 20 });
            int length = colors.length;
            for (int i = 0; i < length; i++) {
                XYSeriesRenderer r = new XYSeriesRenderer();
                r.setColor(colors[i]);
                r.setPointStyle(styles[i]);
                renderer.addSeriesRenderer(r);
            }
        }
    
        private 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);
        }
    
        private XYMultipleSeriesDataset buildDataset(String[] titles, List<double[]> xValues, List<double[]> yValues) {
            XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();
            addXYSeries(dataset, titles, xValues, yValues, 0);
            return dataset;
        }
    
        private void addXYSeries(XYMultipleSeriesDataset dataset, String[] titles, List<double[]> xValues, List<double[]> yValues, int scale) {
            int length = titles.length;
            for (int i = 0; i < length; i++) {
                XYSeries series = new XYSeries(titles[i], scale);
                double[] xV = xValues.get(i);
                double[] yV = yValues.get(i);
                int seriesLength = xV.length;
                for (int k = 0; k < seriesLength; k++) {
                    series.add(xV[k], yV[k]);
                }
                dataset.addSeries(series);
            }
        }
    }

    4、分析demo。

     首先代码看上去貌似很多,不过简单易懂。总结下来不外乎就几个方面:

    ①生成坐标数据。(当然你也可以根据自己的需要生成一组或多组数据,为了数据之间的对比所以文中写了多组数据)。

    ②生成渲染器。渲染器需要设置哪些可以根据需要而定,当然前提是你得知道它每个参数的意义,文中是比较全面的设置。

    ③设置数据和渲染器。

    大概就只做了这些工作,至于具体的实现方法你可以自己阅读一下。

     

    5、总结。

     即使是aChartEngine中最为复杂(个人观点)的line chart也是如此简单,所以剩下的其他组件也复杂不到哪里去。在这个系列的几篇文章中并没有对代码做任何注释原因有下面几个:

    ①网上你基本上可以找到很好的解释,尤其是render的每个参数的设置表示何意义。

    ②强大的官网。你需要的任何相关信息都有。

    ③个人理解不同加之本人英语水平有限,翻译过来恐怕太过生硬。

    ④保持原滋原味,让读者自己结合官网去理解。(授之以鱼不如授之以渔)。

    欢迎交流。期待你的宝贵意见。

  • 相关阅读:
    cropper.js 实现裁剪图片并上传头像
    LINQ查询表达式
    c#扩展方法
    lambda表达式
    axios 封装
    Photoshop的混合模式中的叠加实现光照射在背景上的问题
    laravel官方教程-heroku中数据库迁移出现22023的问题
    laravel官方教程-服务器多php指定问题
    浏览器network信息
    理解CommonJs(用于nodejs)、AMD、CMD、ES6模块
  • 原文地址:https://www.cnblogs.com/vanezkw/p/2615165.html
Copyright © 2011-2022 走看看