aiChartsサンプル:ピラミッド型チャート

概要

ピラミッド型チャートは三角形の中を線で区分わかされているチャートです。それぞれ関連性のある内容が各区分にグループ分けされています。三角形のため、各区分は幅が変わっています。この幅はその内容の中で段階的な階層で表わされています。例えば、一番幅が広い部分は一般的な内容を含み、一番幅が狭い内容はその一般的な内容の中でもより細かい内容であることがあります。

幅は大小の違いを表すものだけではなく、このチャートは階層を表すことに優れているとともに量や大きさを表すこともできます。このグラフの活用法としては経営管理のポジション、販売した商品、ビジネスを展開する場所などで活用できます。どのような場合においてもその階層は進行の順になっていなければなりません。

ピラミッド型チャートを作るには

ピラミッド型チャートを作るには、まずはChartSeriesのインスタンスを作り、チャートタイプ(作図タイプ)をPyramidに設定し、データをセットします。

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

サンプルダウンロードはこちら(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.pyramidsample;

import android.app.Activity;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Typeface;
import android.os.Bundle;

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

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);

		chartView.setPalette(ChartPalette.Grayscale);

		ChartSeries series = chartView.getSeries().get(0);
		String[] names = { "Zombies", "Humans", "Animals", "Plants" };

		for (int i = 0; i < names.length; i++)
		{
			series.getPoints().addXY(i, 1).setLabel(names[i]);
		}

		Paint labelPaint = new Paint();

		labelPaint.setTextSize(16);
		labelPaint.setTypeface(Typeface.DEFAULT_BOLD);
		labelPaint.setColor(Color.WHITE);
		labelPaint.setAntiAlias(true);

		series.setMarkerPaint(labelPaint);
		series.setBorderColor(0); // no border
	}
}

XMLチャート


<?xml version="1.0" encoding="utf-8"?>
<ai:chart xmlns:ai="http://www.artfulbits.com/android/aiCharts">
	<ai:area/>
	<ai:series type="Pyramid" showlabel="true"/>
	<ai:title text="Food Chain" dock="Left"/>
</ai:chart>