สร้างกราฟ Line Chart บน Android ด้วย AChartEngine

1
dependencies {
2
    compile fileTree(dir: 'libs', include: ['*.jar'])
3
}

1
maven {
2
    url "https://repository-achartengine.forge.cloudbees.com/snapshot/"
3
}

1
// Top-level build file where you can add configuration options common to all sub-projects/modules.
2

3
buildscript {
4
    repositories {
5
        mavenCentral()
6
    }
7
    dependencies {
8
        classpath 'com.android.tools.build:gradle:0.11.+'
9

10
        // NOTE: Do not place your application dependencies here; they belong
11
        // in the individual module build.gradle files
12
    }
13
}
14

15
allprojects {
16
    repositories {
17
        mavenCentral()
18
        maven {
19
            url "https://repository-achartengine.forge.cloudbees.com/snapshot/"
20
        }
21
    }
22
}

1
dependencies {
2
    compile 'com.android.support:appcompat-v7:19.+'
3
    compile 'org.achartengine:achartengine:1.2.0'
4
}

1
package com.devahoy.sample.achartengine;
2

3
import android.support.v7.app.ActionBarActivity;
4
import android.support.v7.app.ActionBar;
5
import android.support.v4.app.Fragment;
6
import android.os.Bundle;
7
import android.view.LayoutInflater;
8
import android.view.Menu;
9
import android.view.MenuItem;
10
import android.view.View;
11
import android.view.ViewGroup;
12
import android.os.Build;
13

14
public class MainActivity extends ActionBarActivity {
15

16
    @Override
17
    protected void onCreate(Bundle savedInstanceState) {
18
        super.onCreate(savedInstanceState);
19
        setContentView(R.layout.activity_main);
20

21
        if (savedInstanceState == null) {
22
            getSupportFragmentManager().beginTransaction()
23
                    .add(R.id.container, new PlaceholderFragment())
24
                    .commit();
25
        }
26
    }
27

28
    /**
29
     * A placeholder fragment containing a simple view.
30
     */
31
    public static class PlaceholderFragment extends Fragment {
32

33
        public PlaceholderFragment() {}
34

35
        @Override
36
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
37
                Bundle savedInstanceState) {
38
            View rootView = inflater.inflate(R.layout.fragment_main, container, false);
39
            return rootView;
40
        }
41
    }
42

43
}

1
private void initData() {
2
    String[] months = {
3
            "JAN", "FEB", "MAR", "APR", "MAY", "JUN",
4
            "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"
5
    };
6

7
    int[] index = {1, 2, 3, 4, 5, 6, 7, 8, 9, 10};
8

9
    int[] incomeA = {4000, 5500, 2300, 2100, 2500, 2900, 3200, 2400, 1800, 2100, 3500, 5900};
10
    int[] incomeB = {3600, 4500, 3200, 3600, 2800, 1800, 2100, 2900, 2200, 2500, 4000, 3500};
11
    int[] incomeC = {4300, 4000, 3000, 3200, 2400, 2500, 2600, 3400, 3900, 4500, 5000, 4500};
12
}

1
XYSeries seriesA = new XYSeries("Googla");
2
XYSeries seriesB = new XYSeries("Microsa");
3
XYSeries seriesC = new XYSeries("Appla");
4

5
int length = index.length;
6
for (int i = 0; i < length; i++) {
7
    seriesA.add(index[i], incomeA[i]);
8
    seriesB.add(index[i], incomeB[i]);
9
    seriesC.add(index[i], incomeC[i]);
10
}

1
XYSeriesRenderer rendererA = new XYSeriesRenderer();
2
rendererA.setPointStyle(PointStyle.CIRCLE);
3
rendererA.setColor(Color.RED);
4
rendererA.setLineWidth(2);

1
XYMultipleSeriesDataset dataset = new XYMultipleSeriesDataset();
2
dataset.addSeries(seriesA);
3
dataset.addSeries(seriesB);
4
dataset.addSeries(seriesC);

1
XYMultipleSeriesRenderer multipleSeriesRenderer
2
    = new XYMultipleSeriesRenderer();
3

4
for (int i = 0; i < length; i++) {
5
    multipleSeriesRenderer.addXTextLabel(i + 1, months[i]);
6
}
7
multipleSeriesRenderer.setChartTitle("ตัวอย่างกราฟเส้น (Line Chart)");
8
multipleSeriesRenderer.setYTitle("ยอดขายรวม(สตางค์)");
9
multipleSeriesRenderer.setXTitle("ปี พ.ศ. 2600");
10
multipleSeriesRenderer.setZoomButtonsVisible(true);

1
multipleSeriesRenderer.addSeriesRenderer(rendererA);
2
multipleSeriesRenderer.addSeriesRenderer(rendererA);
3
multipleSeriesRenderer.addSeriesRenderer(rendererA);

1
drawChart(dataset, multipleSeriesRenderer);

1
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
2
    xmlns:tools="http://schemas.android.com/tools"
3
    android:layout_width="match_parent"
4
    android:layout_height="match_parent"
5
    android:id="@+id/graph_container"
6
    tools:context="com.devahoy.sample.achartengine.MainActivity$PlaceholderFragment" >
7

8
</RelativeLayout>

1
private View mView;
2

3
@Override
4
public View onCreateView(LayoutInflater inflater, ViewGroup container,
5
        Bundle savedInstanceState) {
6
    View rootView = inflater.inflate(R.layout.fragment_main, container, false);
7
    mView = rootView;
8
    initData();
9
    return rootView;
10
}

1
private void drawChart(XYMultipleSeriesDataset dataset,
2
                       XYMultipleSeriesRenderer renderer) {
3
    GraphicalView graphView =
4
            ChartFactory.getLineChartView(getActivity(), dataset, renderer);
5

6
    RelativeLayout container =
7
            (RelativeLayout) mView.findViewById(R.id.graph_container);
8

9
    container.addView(graphView);
10
}

1
XYSeriesRenderer rendererB = new XYSeriesRenderer();
2
rendererB.setPointStyle(PointStyle.X);
3
rendererB.setColor(Color.BLUE);
4
rendererB.setLineWidth(2);
5

6
XYSeriesRenderer rendererC = new XYSeriesRenderer();
7
rendererC.setPointStyle(PointStyle.DIAMOND);
8
rendererC.setColor(Color.GREEN);
9
rendererC.setLineWidth(2);

1
multipleSeriesRenderer.addSeriesRenderer(rendererA);
2
multipleSeriesRenderer.addSeriesRenderer(rendererA);
3
multipleSeriesRenderer.addSeriesRenderer(rendererA);

1
multipleSeriesRenderer.addSeriesRenderer(rendererA);
2
multipleSeriesRenderer.addSeriesRenderer(rendererB);
3
multipleSeriesRenderer.addSeriesRenderer(rendererC);

1
multipleSeriesRenderer.setXLabels(0);
2
multipleSeriesRenderer.setBackgroundColor(Color.WHITE);
3
multipleSeriesRenderer.setApplyBackgroundColor(true);
4
multipleSeriesRenderer.setMarginsColor(Color.WHITE);
5
multipleSeriesRenderer.setLabelsColor(Color.BLACK);
6
multipleSeriesRenderer.setAxesColor(Color.GRAY);
7
multipleSeriesRenderer.setYLabelsColor(0, Color.BLACK);
8
multipleSeriesRenderer.setXLabelsColor(Color.BLACK);