m_shige1979のときどきITブログ

プログラムの勉強をしながら学習したことや経験したことをぼそぼそと書いていきます

Github(変なおっさんの顔でるので気をつけてね)

https://github.com/mshige1979

androidでグラフを表示(AFreeChart)

今回は

とりあえず出すだけ
出さないとできないかどうかも決められない

jarを取得

https://code.google.com/p/afreechart/
より最新のjarをダウンロード

f:id:m_shige1979:20150106214143p:plain

雛形を準備

ダウンロードしたjarファイルをlibsディレクトリへコピー

f:id:m_shige1979:20150106215159p:plain

build.gradleへ追加して同期
apply plugin: 'com.android.application'

android {
    compileSdkVersion 21
    buildToolsVersion "21.1.2"

    defaultConfig {
        applicationId "jp.mshige1979.app.sampleappgraph2"
        minSdkVersion 15
        targetSdkVersion 21
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:appcompat-v7:21.0.3'
    compile files('libs/afreechart-0.0.4.jar')
}
Viewファイルを作成

GraphView

package jp.mshige1979.app.sampleappgraph2;

import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.View;

import org.afree.chart.AFreeChart;
import org.afree.graphics.geom.RectShape;

/**
 */
public class GraphView extends View {

    private AFreeChart chart;
    private RectShape chartArea;

    public GraphView(Context context, AttributeSet attrs) {
        super(context, attrs);
        // TODO Auto-generated constructor stub
        chartArea = new RectShape();
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        chartArea.setWidth(w);
        chartArea.setHeight(h/2);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        this.chart.draw(canvas, chartArea);
    }

    public void setChart(AFreeChart chart) {
        this.chart = chart;
    }
}
MainActivity
package jp.mshige1979.app.sampleappgraph2;

import android.graphics.Color;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;

import org.afree.chart.AFreeChart;
import org.afree.chart.ChartFactory;
import org.afree.chart.plot.PlotOrientation;
import org.afree.data.xy.XYSeries;
import org.afree.data.xy.XYSeriesCollection;
import org.afree.graphics.SolidColor;


public class MainActivity extends ActionBarActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        XYSeriesCollection dataset = new XYSeriesCollection();
        XYSeries series = new XYSeries("XYSeries");
        series.add(1, 1);
        series.add(2, 2);
        series.add(3, 3);
        series.add(4, 2);
        series.add(5, 3);
        series.add(6, 4);
        series.add(7, 7);
        dataset.addSeries(series);

        AFreeChart chart = ChartFactory.createXYLineChart(
                "タイトル", 
                "X軸ラベル",
                "Y軸ラベル", 
                dataset, 
                PlotOrientation.VERTICAL, 
                false, 
                true, 
                false
        );

        chart.setBackgroundPaintType(new SolidColor(Color.GRAY));//背景の色
        chart.setBorderPaintType(new SolidColor(Color.BLACK));//枠線の色

        GraphView spcv = (GraphView) findViewById(R.id.graphView1);
        spcv.setChart(chart);

    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

レイアウトファイルにグラフを追加

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
    android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

    <jp.mshige1979.app.sampleappgraph2.GraphView
        android:id="@+id/graphView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    
</RelativeLayout>

※デザインがなんかおかしいけどそのままでおk

結果

f:id:m_shige1979:20150106222542p:plain

所感

なんとか出すことができました。値の遷移を確認する処理を作成したいとかなんか変化をビジュアライズに確認したい場合は頼りにすると思います。javaとかandroidとかは基本、初心者なのでライブラリのインポートとか結構手間取っている感じ。