[Android] 꺽은선 그래프 만들기 (MpAndroidChart)


저번 포스팅에서는 MpAndroidChart 라이브러리를 활용해 원그래프(PieChart)를 만드는 방법을 알아봤습니다. 이번에는 MpAndroidChart 라이브러리를 활용하여 안드로이드 꺾은선그래프(LineChart)를 만드는 방법에 대해서 알아보겠습니다.



안드로이드 꺽은선 그래프 만들기


build.gradle

repositories{
    maven {url "https://jitpack.io"}
}
dependencies {
    compile 'com.github.PhilJay:MpAndroidChart:v3.0.2'
}

먼저 MpAndroidChart 라이브러리 사용을 위해 build.gradle에서 아래에 있는 두줄을 추가해주도록 하겠습니다.


XML

<?xml version="1.0" encoding="utf-8"?>
<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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="app.num.linechart.MainActivity">

        <com.github.mikephil.charting.charts.LineChart
            android:id="@+id/chart"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

</RelativeLayout>


JAVA

public class MainActivity extends AppCompatActivity {

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

        LineChart lineChart = (LineChart) findViewById(R.id.chart);

        ArrayList<Entry> entries = new ArrayList<>();
        entries.add(new Entry(4f, 0));
        entries.add(new Entry(8f, 1));
        entries.add(new Entry(6f, 2));
        entries.add(new Entry(2f, 3));
        entries.add(new Entry(18f, 4));
        entries.add(new Entry(9f, 5));
        entries.add(new Entry(16f, 6));
        entries.add(new Entry(5f, 7));
        entries.add(new Entry(3f, 8));
        entries.add(new Entry(7f, 10));
        entries.add(new Entry(9f, 11));

        LineDataSet dataset = new LineDataSet(entries, "# of Calls");

        ArrayList<String> labels = new ArrayList<String>();
        labels.add("January");
        labels.add("February");
        labels.add("March");
        labels.add("April");
        labels.add("May");
        labels.add("June");
        labels.add("July");
        labels.add("August");
        labels.add("September");
        labels.add("October");
        labels.add("November");
        labels.add("December");

        LineData data = new LineData(labels, dataset);
        dataset.setColors(ColorTemplate.COLORFUL_COLORS); //
        /*dataset.setDrawCubic(true); //선 둥글게 만들기
        dataset.setDrawFilled(true); //그래프 밑부분 색칠*/

        lineChart.setData(data);
        lineChart.animateY(5000);

    }
}


메서드 참고 URL



완성본

MpAndroidChart



[Android] 원 그래프 만들기 (MpAndroidChart)


이 댓글을 비밀 댓글로
    • 2018.05.16 22:38
    비밀댓글입니다
    • 메인에다가 하실꺼면 그냥 바로 복붙하셔도 되고요 다른페이지에서 띄우실꺼면 새로 new file 하셔서 만드신뒤 Intent로 페이지 전환 하는식으로 하시면 됩니다.
    • 홍홍
    • 2018.05.30 21:32 신고
    제가 진행하던 코드에 이 파일을 붙여넣기를 했는데
    LineData data = new LineData(labels, dataset);
    이 부분의 labels와 dataset부분에 빨간 줄이 그어집니다.
    LineData(com.github.mikephil.charting.interfaces.datasets.ILineDataSet...)
    in LineData cannot be applied to
    (java.util.ArrayList<java.lang.String>,
    com.github.mikephil.charting.data.LineDataset) 라고 말이 나오는데 어떻게 해결해야할까요..?
    • 그냥 코드 붙여넣기만했는데 오류가 난다구요? 순서대로 코드를 붙여넣었으면 오류가 안날텐데 잘 모르겠네요.ㅠㅠ. 저 코드만 써서 그래프 프로젝트 하나만들어보시고 다시한번 합쳐보세요.
    • 초심자
    • 2018.07.23 13:38 신고
    서브 액티비티에서 fragment로 화면을 구성 중 이고요 데이터 베이스는 파이어 베이스를 사용중에 있습니다.
    Activity에서는 onCreate로 작성되어 있는데 Fragmen에서 View onCreateView작성중인데 그대로 사용해도 상관이 없나요?
    수정해야된다면 어딜 수정해야 되나요?
    • onCreateView 안에 그대로 쓰시면 될 듯 합니다.
      • 초심자
      • 2018.07.23 14:38 신고
      말씀해주신데로 진행을 하였는데요
      홍홍님과 같은 현상이 발생하였습니다
      복사 후에 import class하니까 LineData data = new LineData(labels, dataset); 에서labels,dataset 이부분이 붉은 줄이 생성되었습니다. 뭐가 문제 일까요?
    • 혹시모르니 import한번 해보세요 집에가서 한번 확인해보겠습니다.
      • 초심자
      • 2018.07.23 15:30 신고
      error: constructor LineData in class LineData cannot be applied to given types;
      required: ILineDataSet[]
      found: ArrayList<String>,LineDataSet
      reason: varargs mismatch; ArrayList<String> cannot be converted to ILineDataSet
      에러로그는 다음과 같이 출력되었습니다
    • 혹시 import com.github.mikephil.charting.data.LineData; 이렇게 import는 하셨나요?
      • 초심자
      • 2018.07.25 12:01 신고
      네 그렇게 뜨는걸로 했어요
      • 초심자
      • 2018.07.25 18:06 신고
      LineData data = new LineData(labels, dataset)에서 labels부분을 제거해서 진행을 했을때에 붉은 줄 없이 진행이 되는데 이렇게 진행을 했을 경우에 문제가 될까요?
    • LineData 생성자는 안까봐서 잘 모르겠는데 라벨을 안넣으시면 그래프상에서 가로 텍스트가 입력이 안된다거나 그러지 않을까 추측해봅니다.
    • wony
    • 2018.08.09 18:44 신고
    라이브러리 예제와 설명 감사합니다.
    LineData data = new LineData(labels, dataset); 코드에러는
    compile 'com.github.PhilJay:MpAndroidChart:v3.0.2' 가 아닌 2.1.6 버전으로 진행하면 에러가 안납니다.
    전 이렇게 했습니다.
    implementation 'com.github.PhilJay:MPAndroidChart:v2.1.6'
    최신버전에 들어서 생성자가 사라져버렸네요
    • 버전이 바뀌면서 조금 달라졌나봐요. 해결방법 알려주셔서 감사합니다.
    • ㅜㅜ
    • 2018.09.03 21:38 신고
    질문이 있습니다
    저는 MpAndroidChart 막대 그래프를 사용중인데요
    barEntries.add(new BarEntry(120f, 99f));
    이부분이 막대그래프를 높이와 위치를 표시하는 걸로 알고 있는데
    가로 부분에는 입력 데이터(숫자) 값을 세로 부분에는 날짜 를 기입하려고
    어떻게 해야되는지 문의 드립니다.