【Android】Androidでグラフを描画する - 線グラフ編

00. はじめに

Androidでアプリ開発を行っているとグラフを描画したい場面が発生する場合があります。
そこで今回は、Android用グラフ描画ライブラリ『MPAndroidChart』を使用し線グラフを描画する方法を見ていきます。
ただし、ごちゃごちゃ書くのはしんどいので基本的にGithubに上げたサンプルアプリの該当ソースへのリンクを張るだけにします。

01. projectへのMPAndroidChartの導入

build.gradleに以下を追加します。
この文を書いているときの最新はv3.0.3なので、それを使用します。

android {
    repositories {
        maven { url "https://jitpack.io" }
    }
}

dependencies {
    compile 'com.github.PhilJay:MPAndroidChart:v3.0.3'
}

02. 静的な線グラフ

はじめからグラフ化する値が決まっているグラフの場合

02-01. 静的なグラフの描画

ソース | https://github.com/entan05/MPAndroidChartSample/blob/master/app/src/main/java/jp/team/e_works/mpandroidchartsample/activity/StaticLineGraphActivity.java
レイアウト | https://github.com/entan05/MPAndroidChartSample/blob/master/app/src/main/res/layout/activity_static_line_graph.xml

02-02. 静的なグラフの描画(複数)

ソース | https://github.com/entan05/MPAndroidChartSample/blob/master/app/src/main/java/jp/team/e_works/mpandroidchartsample/activity/StaticMultiLineGraphActivity.java
レイアウト | https://github.com/entan05/MPAndroidChartSample/blob/master/app/src/main/res/layout/activity_static_multi_line_graph.xml

02-03. グラフの保存

描画しているグラフを画像ファイルとして保存することができる。
まず、manifestでストレージへの書き込み権限を設定する。

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

LineChart#saveToGallery(String, int)をコールすることで保存することができる。

if(mLineChart != null) {
    mLineChart.saveToGallery("saveFileName", 100);
}

第一引数が保存ファイル名、第二引数がクオリティ。
保存先は

/sdcard/DCIM/

となる。

03. 動的な線グラフ

グラフに描画する値が後から追加で来る場合
キャプチャ動画はfpsが出ていない感じだったので略

03-01. 動的なグラフの描画

LineChart#moveViewToX(float)でもオシロスコープのようにすることができるが、ズームをしていると描画位置更新の際にy座標を所定の位置に戻され見ずらいので、LineChart#moveViewTo(float, float, AxisDependency)を使用している。

ソース | https://github.com/entan05/MPAndroidChartSample/blob/master/app/src/main/java/jp/team/e_works/mpandroidchartsample/activity/DynamicLineGraphActivity.java
レイアウト | https://github.com/entan05/MPAndroidChartSample/blob/master/app/src/main/res/layout/activity_dynamic_line_graph.xml

03-02. 動的なグラフの描画(複数)

ソース | https://github.com/entan05/MPAndroidChartSample/blob/master/app/src/main/java/jp/team/e_works/mpandroidchartsample/activity/DynamicMultiLineGraphActivity.java
レイアウト | https://github.com/entan05/MPAndroidChartSample/blob/master/app/src/main/res/layout/activity_dynamic_multi_line_graph.xml

98. 参考

MPAndroidChart | https://github.com/PhilJay/MPAndroidChart
MPAndroidChartを使って「リアルタイム更新のセンサーデータ時系列グラフ」のサンプルを作ってみた | https://qiita.com/LyricalMaestro0/items/2ec88b4ecb85b18d0468

99. 更新履歴

日付	内容
2018/03/11	投稿
2018/03/11	静的なグラフのキャプチャ画像を追加 動的なグラフのキャプチャ動画を載せない旨を追記