whitespace COMPANY whitespace SERVICES whitespace PRODUCTS whitespace PURCHASE whitespace SUPPORT whitespace CONTACTS whitespace Home whitespace Contact Us whitespace Site Map whitespace
whitespace
WHY ARTFULBITS
whitespace
OUR APPROACH
whitespace
OUR TEAM
whitespace
FACT SHEET
whitespace
NEWS & EVENTS
whitespace
PRIVACY
whitespace
whitespace

Area Chart Type

Overview

An area chart displays graphically quantitative data. This chart type is based on the line chart. An area chart emphasizes a change in values by filling in the portion of the graph beneath the line connecting various data points. The area between axis and line are commonly emphasized with colors, textures, hatchings or animation. This colorful and visual display distinguishes the data more clearly. Along with the line chart, the area chart is the only chart type that displays data contiguously. For example, you can use this chart type to show change in the relative amounts of the principal and interest over the time of a mortgage. There are some modifications of those charts: spline area, stack area, stack area 100%.

Creating the Area Chart

In order to create a simple area chart is needed to create an instance of chart series, set ChartType as Area and fill series with some data, like in the following sample:

zip archive Download sample

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
  <com.artfulbits.aiCharts.ChartView
    android:id="@+id/chartView"
    chart="@xml/chart"
    android:background="@android:drawable/alert_dark_frame" 
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"/>
</LinearLayout>
package com.artfulbits.aiCharts.areasample;

import com.artfulbits.aiCharts.ChartView;
import com.artfulbits.aiCharts.Base.*;

import android.app.Activity;
import android.os.Bundle;

public class MainActivity extends Activity
{
	/** Called when the activity is first created. */
	@Override
	public void onCreate(Bundle savedInstanceState)
	{
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);

		ChartView chartView = (ChartView) findViewById(R.id.chartView);
		
		ChartSeries series1 = chartView.getSeries().get("Series1");
		ChartSeries series2 = chartView.getSeries().get("Series2");
		
		double[] data1 = { 82, 75, 96, 65, 87 };
		double[] data2 = { 37, 28, 43, 48, 56 };

		series1.getPoints().setData(data1);
		series2.getPoints().setData(data2);
	}
}
<?xml version="1.0" encoding="utf-8"?>
<ai:chart xmlns:ai="http://www.artfulbits.com/android/aiCharts">
	<ai:area />

	<ai:series name="Series1" legend="Legend1" type="Area" color="#FF589AF1"/>
	<ai:series name="Series2" legend="Legend2" type="Area" color="#FFE5B059"/>
	
	<ai:legend name="Legend1" dock="Right"/>
	<ai:legend name="Legend2" dock="Left"/>
</ai:chart>
Company | Services | Practices | Technologies | Career | Contacts | Privacy
© 2005-2016 ArtfulBits. All rights reserved.