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的每個參數的設置表示何意義。

②強大的官網。你需要的任何相關信息都有。

③個人理解不同加之本人英語水平有限,翻譯過來恐怕太過生硬。

④保持原滋原味,讓讀者自己結合官網去理解。(授之以魚不如授之以漁)。

歡迎交流。期待你的寶貴意見。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM