🍣
MPAndroidChartで統計グラフ
統計グラフ欲しいなと思った
グラフのあるアプリって、ぱっと見で資産の推移とか純利益が見れたりしていいなっておもった
特に、某MoneyTreeとかをみて、、、笑
なので、googleってみたら、MPAndroidChartなるものが、いいよって記事がいっぱいあったので、使ってみることにした
目標
資産の推移グラフと純利益が分かるグラフ(某MoneyTreeぽいの)を作成する!!
導入
android studioを開いて、
build.gradle(:${projectName}) ->
allprojects {
repositories{
:
maven { url 'https://jitpack.io' }
:
}
build.gradle(:app) ->
dependencies {
implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'
}
で、syncして導入完了
使い方
この記事見ました
私があーやこーやいうよりとっても分かりやすい 笑
一応、復習もかねて、ざっと言うと
- Entry
イメージは、実験したときの記録の一つ
Entry 1つ に、(x,y or y[])を代入する
new BarEntry(x, y or y[]);
- DataSet
Entryの集合体
Entryを、DataSetに集める
List<Entry> entryList = new ArrayList<>();
for (int i=0; i< size; i++) {
//x,yを取得
float x = getX(i);
float y = getY(i);
//entryListに格納
entryList.add(new Entry(x, y));
}
//labelは、凡例に表示される名前
DataSet DataSet = new DataSet(entryList, label);
//<DataSetのフォーマット指定>
~~~
他にも集めたいデータがあれば、繰り返す(例えば、折れ線グラフの2本目の線)
- Data
DataSetの集合体
DataSetを、Dataに集める
Data Data = new Data(DataSet);
//<Dataのフォーマット指定>
- (CombinedDataのとき)
違う種類のchartを合わせるときにつかうやーつ
さっき作ったDataを代入する
CombinedData data = new CombinedData();
//Data設定
data.setData(lineData);
data.setData(barData);
data.setData(scatterData);
data.setData(candleData);
data.setData(bubbleData);
//<Dataのフォーマット指定>
- Chart
実際に画面に描いてくれるやつ
Chartにセットして完了
Chart chart = view.findViewById(R.id.chart);
//Dataを設定
Chart.setData(data);
//<Chartの各種設定>
てやると、なんとグラフを表示してくれます。
とても便利だ!
ハマったとこ
onClick()が見つからない
onClickがあると思い込んでて、探したらなくて焦った
正解は、OnChartValueSelectedListenerでした
グラフをタップすると、強調される、そんときのcallbackを受け取ることで、求めていたonClick的な役割を作成できた
callback
chart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() {
@Override
public void onValueSelected(Entry e, Highlight h) {
//highlightが点いた
}
@Override
public void onNothingSelected() {
//どこもhighlightが消えた
}
});
プログラムから、変更
chart.highlightValue(hightlight, callListener);
//Hightlight hightlight 点けるHightlight,消すときは、null
//boolean callListener そのとき、callback呼び出すか
labelの表示がわからん
1月、2月、3月、、、に対応したグラフを表示したいと思ったとき
//ラベル
List<String> labels = Arrays.asList("1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月");
//x軸の取得、y軸のときも同じ
XAxis xAxis = chart.getXAxis();
//xの値に対して、どんな数値を返すか
xAxis.setValueFormatter(new ValueFormatter() {
@Override
public String getFormattedValue(float value) {
return labels.get((int)value%labels.size());
}
});
色々できて楽しいが、その分考えすぎて、よく寝た 笑
作ったグラフは、アプリ内にあります
ぜひ、応援のダウンロードよろしくおねがいします。
Discussion