aiChartsサンプル:積み上げ面積チャート

概要

積み上げ面積チャートはいくつかのデータセットが垂直に積み重なったものをいいます。もしデータセットが一つしかない場合、それは普通の面積チャートと同じになります。

積み上げ面積チャートを作るには

積み上げ面積チャートを作るには、まずはChartSeriesのインスタンスを作り、チャートタイプ(作図タイプ)をStackedAreaに設定し、データをセットします。

ソースコードは以下のようになります。

サンプルダウンロードはこちら(ZIP,14KB)

イメージ図

XML アクティビティレイアウト


<?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>

Java


package com.artfulbits.aiCharts.stackedareasample;

import com.artfulbits.aiCharts.ChartView;
import com.artfulbits.aiCharts.Base.ChartPoint;
import com.artfulbits.aiCharts.Base.ChartSeries;

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 sunSeries = chartView.getSeries().get("Sun");
		ChartSeries rainSeries = chartView.getSeries().get("Rain");
		ChartSeries snowSeries = chartView.getSeries().get("Snow");

		String[] labels = { "summer", "autumn", "winter", "spring", "summer" };
		double[] sun = { 50, 30, 20, 40, 50 };
		double[] rain = { 30, 50, 5, 40, 30 };
		double[] snow = { 0, 30, 80, 20, 0 };

		for (int i = 0; i < sun.length; i++)
		{
			ChartPoint point = sunSeries.getPoints().addXY(i, sun[i]);

			rainSeries.getPoints().addXY(i, rain[i]);
			snowSeries.getPoints().addXY(i, snow[i]);

			point.setAxisLabel(labels[i]);
		}
	}
}

XMLチャート


<?xml version="1.0" encoding="utf-8"?>
<ai:chart xmlns:ai="http://www.artfulbits.com/android/aiCharts">
	<ai:area>
		<ai:area.yaxis labels_visible="false"/>
		<ai:area.xaxis labels_mode="SeriesLabels"/>
	</ai:area>
	<ai:series type="StackedArea" name="Sun" color="#FFFFD800"/>
	<ai:series type="StackedArea" name="Snow" color="#FFFFFFFF"/>
	<ai:series type="StackedArea" name="Rain" color="#FF0094FF"/>
	<ai:legend/>
</ai:chart>