MPAndroidChart 를 사용해 2개 이상의 꺾은선 그래프를 작성한다【Java】
16484 단어 MPAndroidChartAndroidStudio자바
이 기사를 쓰려고 생각한 이유
Android 앱 제작 초보자입니다.
텍스트나 웹 검색으로 어떻게든 형태 있는 것을 만들고 있습니다만, 생각의 기본이 좀처럼 익히지 않고 참고가 될 것 같은 코드를 언제나 찾아 돌고 있습니다.
이번 데이타베이스와 접속해 그 데이터를 이용한 2개의 꺾은선 그래프를 작성했습니다만, 라인 2번째의 기술을 모르고 고전했으므로 여기에 기록하고 싶습니다.
참고
머니 포워드 엔지니어 블로그 (Android : 그래프 표시로 표현 풍부하게. MPAndroidChart를 사용해 보자!)
nyan의 앱 개발 ([Android] MPAndroidChart 라이브러리로 그래프 그리기) ← 많은 기사가 실려 있는 블로그입니다. 전반적으로 신세를 졌습니다.
환경
Windows10
AndroidStudio4
그래프 초기화
MPAndroidChart의 도입이나 레이아웃은 참고 사이트를 봐 주세요.
내가 사용하지 않았던 메소드도 코멘트 아웃 해 몇 개 싣고 있습니다.
LineChartActivity.java
LineChart mChart = findViewById(R.id.lineChart);
// グラフ説明テキストを表示するか
mChart.getDescription().setEnabled(true);
// グラフ説明テキスト(アプリ名など)
mChart.getDescription().setText(getResources().getString(R.string.app_name));
// グラフ説明テキストの文字色設定
//mChart.getDescription().setTextColor(Color.BLACK);
// グラフ説明テキストの文字サイズ設定
//mChart.getDescription().setTextSize(10f);
// グラフ説明テキストの表示位置設定
//mChart.getDescription().setPosition(0, 0);
// グラフの背景色
mChart.setBackgroundColor(Color.WHITE);
// x軸の設定
XAxis xAxis = mChart.getXAxis();
// x軸を斜めに出力
xAxis.setLabelRotationAngle(45);
// x軸最大値最小値
// 以下だと0~9番目が出力される(10個)書かないと、登録したデータ分表示される
xAxis.setAxisMinimum(0f);
xAxis.setAxisMaximum(9f);
// データベースに登録した年月日をx軸に設定
xAxis.setValueFormatter(new IndexAxisValueFormatter(getDate()));
// x軸を破線にする(Dashed Line)
xAxis.enableGridDashedLine(10f, 10f, 0f);
xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
// y軸の設定
YAxis yAxis = mChart.getAxisLeft();
// Y軸最大最小設定
yAxis.setAxisMaximum(150f);
yAxis.setAxisMinimum(50f);
// y軸を破線にする
yAxis.enableGridDashedLine(10f, 10f, 0f);
yAxis.setDrawZeroLine(true);
// 右側の目盛り。不要ならfalse
mChart.getAxisRight().setEnabled(false);
x축 설정
x축 설정의 getDate 메소드입니다.
데이터베이스에 등록한 데이터 유형을 변경해야 했습니다.
더 스마트하게 쓸 수 있을 것 같습니다만, 지금의 나에서는 여기까지입니다.
변수 date 는 데이터베이스의 데이터를 보관 유지하고 있는 ArrayList
LineChartActivity.java
// String型で保存したデータをdate型に書き直して SimpleDateFormat
private ArrayList<String> getDate() {
ArrayList<String> dateLabels = new ArrayList<>();
for (int i = 0; i < date.size(); i++) {
try {
// 年月日を月日に修正
String strDate = date.get(i);
DateFormat dateFormat = new SimpleDateFormat("yyyy/MM/dd");
Date entryDate = dateFormat.parse(strDate);
DateFormat dt = new SimpleDateFormat("MM/dd");
String setDate = dt.format(entryDate);
dateLabels.add(setDate);
} catch (ParseException e) {
e.printStackTrace();
}
}
return dateLabels;
}
데이터 표시
변수 valuesMax 와 valuesMin 은 데이터베이스의 데이터를 보관 유지하고 있는 ArrayList
LineChartActivity.java
ArrayList<Entry> valuesMax = new ArrayList<>();
ArrayList<Entry> valuesMin = new ArrayList<>();
LineDataSet max; // ライン引数
LineDataSet min;
// ラインの設定メソッド
max = new LineDataSet(valuesMax, "A");// ラベルの名前
max.setColor(Color.RED); // 線の色
max.setCircleColor(Color.RED); // 座標の色
max.setLineWidth(5f); // 線の太さ 1f~
max.setCircleRadius(5f); // 座標の大きさ
max.setDrawCircleHole(false); // 座標を塗りつぶす→false 塗りつぶさない→true
max.setValueTextSize(10f); // データの値を記す。0fで記載なし。floatだから小数点がつく
max.setDrawFilled(true); // 線の下を塗りつぶすか否か
max.setFillColor(Color.RED); // 塗りつぶしたフィールドの色
// もう1セット作る
min = new LineDataSet(valuesMin, "B");
min.setColor(Color.BLUE);
min.setCircleColor(Color.BLUE);
min.setLineWidth(5f);
min.setCircleHoleRadius(5f);
min.setDrawCircleHole(false);
min.setValueTextSize(10f);
min.setDrawFilled(true);
min.setFillColor(Color.BLUE);
// chartにラインをset
ArrayList<ILineDataSet> dataSets = new ArrayList<>();
dataSets.add(max);
dataSets.add(min);
LineData lineData = new LineData(dataSets);
mChart.setData(lineData);
// データをアニメーションで出す。ミリ秒.数値が大きいと遅い
mChart.animateX(1000);
ILineDateSet에 추가한 라인이 화면에 표시됩니다.
완성된 것
두 개의 그래프가 표시되었습니다.
채우기를 빨강과 파랑으로 했습니다만, 파랑 라인 아래는 섞여 보라색이 되어 있네요◎
도움이되면 다행입니다.
Reference
이 문제에 관하여(MPAndroidChart 를 사용해 2개 이상의 꺾은선 그래프를 작성한다【Java】), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/yuyuyuki555/items/72e0ef00f96b7db9288f텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)