Click here to Skip to main content
14,697,269 members
Articles » Mobile Development » Android » General
Posted 16 Jul 2014


17 bookmarked

Creating Charts in Android using the AChartEngine Library

Rate me:
Please Sign up or sign in to vote.
4.52/5 (9 votes)
16 Jul 2014CPOL
This article explains how you can create charts in an Android application.

Image 1

Image 2


In this article, I am showing the use of the AChartEngine charting library for Android to create charts for the Android platform. The AChartEngine library is an open source charting library for Android and supports all Android versions from 1.6 onwards. The project in this article is based on version 1.1.0 of the AChartEngine library.


For demonstration of this article, I have created a project which plots sine, cosine and tangent charts. I have created the project in AIDE installed on Android X86 emulator running on VMWare. AIDE is an Android IDE for Android devices. AIDE completely runs on any Android based phone or tablet, as well as, it can be installed on Android emulator running on a virtual machine. Same method of development can be used to develop the project using the traditional eclipse based approach.

In order to start using AChartEngine, the main library (achartengine-1.1.0.jar) has to be copied to the lib folder of your Android project. AChartEngine supports three types of charts:

  • XY Charts - These charts display data using an X-axis and a Y-axis, for e.g., line, area, bar, scatter.
  • Round Charts - These are circular charts, for e.g., Pie, Doughnut, Dial.
  • Combined Charts - These charts display a combination of several XY charts.

Using the Code

The main layout file has a linear layout with id as "@+id/chart".

Following is the layout XML file:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android=""





    android:orientation="vertical" >

We need to override the onResume() method of the Activity class in the MainActivity class as follows:

protected void onResume()

    // Get a reference of the layout
    LinearLayout layout=(LinearLayout)findViewById(;
        // Initialize the chart

        // Add data to the chart

        // Create a line chart
        myChart=ChartFactory.getLineChartView(this, mySeries, myRenderer);

        // Add chart to the layout
        // Refresh the chart

The above code references the chart layout and calls the user defined function initializeChart() to initalize the chart parameters and another user defined function addData() to add data to the chart. It then creates a line chart based on the specified data and adds the chart to the layout. If the chart is already created, it simply refreshes the chart by calling the repaint() method.

Following is the code of the initializeChart() method:

>private void initializeChart()
    // Initialize renderers
    sineRenderer=new XYSeriesRenderer();
    cosineRenderer=new XYSeriesRenderer();
    tangentRenderer=new XYSeriesRenderer();

    // Set color for each series

    // Create XYMultipleSeriesRenderer
    myRenderer=new XYMultipleSeriesRenderer();

    // Add renderers to XYMultipleSeriesRenderer

    // Disable panning

    // Set Y-Axis range

    // Initialize series
    sineSeries=new XYSeries("Sine");
    cosineSeries=new XYSeries("Cosine");
    tangentSeries=new XYSeries("Tangent");

    // Create XYMultipleSeriesDataset
    mySeries=new XYMultipleSeriesDataset();

    // Add series to XYMultipleSeriesDataset

The above code creates three XYSeriesRenderer objects, sineRenderer, cosineRenderer and tangentRenderer and initializes them with red, green and blue colors respectively. It then adds the three renderers to an XYMultipleSeries renderer object called myRenderer. Panning is disabled by calling the setPanEnabled(false) method. The range for the Y-Axis is set from -1 to 1 by using the setYAxisMin() and setYAxisMax() methods. Three XYSeries objects, sineSeries, cosineSeries and tangentSeries, are created and added to an XYMultipleSeriesDataset object called mySeries.

Following is the code of the addData() method:

private void addData()
    // Add data to the chart series
    for(int angle=5;angle<=1440;angle+=5)
        sineSeries.add(angle, Math.sin(angle*(Math.PI/180)));
        cosineSeries.add(angle, Math.cos(angle*(Math.PI/180)));
        tangentSeries.add(angle, Math.tan(angle*(Math.PI/180)));

The above code adds sine, cosine and tangent data to the respective XYSeries objects for angles ranging from 5 to 1440. The parameters to the trigonometric functions are converted from degrees to radians by using the formula "angle * (? / 180)".

Running the program creates a line chart as follows:

Image 3

Changing the getLineChartView() method to getBarChartView() in this way myChart=ChartFactory.getBarChartView(this, mySeries, myRenderer, BarChart.Type.Default), produces a bar chart as follows:

Image 4

Points of Interest

The AChartEngine is a very useful charting library which can be easily used by amateurs and skilled professionals alike to create elegant charts for the Android platform.


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Azim Zahir
Instructor / Trainer NIIT, India
India India
I am a trainer by profession. Currently I am working with NIIT (Mumbai, India) as a Senior Faculty. I enjoy programming as a hobby. My favorite technologies are Flash, Flex and Silverlight.

Of late I have developed keen interest in WPF and Windows Mobile programming.

Apart from computers, my favorite pastime is bicycling.

Comments and Discussions

Questionandroid graph Pin
Member 1156454029-Mar-15 6:19
MemberMember 1156454029-Mar-15 6:19 
GeneralaChartEngine Issue on LineChart Pin
androsathish2-Dec-14 23:58
professionalandrosathish2-Dec-14 23:58 
I am using aChartEngine for Graph.. in LineChartView does not draw with unsorted values . when i gave unsorted values it it be automatically sorted and then draw the lines

for example i gave x={-50,50,20,-12,90};y={-10,10,-40,90,100};
ie (-50,-10) (50,10) (20,-40) (-12,90) (90,100) like this

but the line draws like (-50,-10) (-12,90) (20,-40) (50,10) (90,100)

​how to resolve this issue.. kindly give a solution for this.

GeneralMy vote of 5 Pin
Ștefan-Mihai MOGA13-Aug-14 4:22
professionalȘtefan-Mihai MOGA13-Aug-14 4:22 
GeneralRe: My vote of 5 Pin
Azim Zahir15-Aug-14 18:19
MemberAzim Zahir15-Aug-14 18:19 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.