[JAVA][Android] AnyChart 로 막대그래프 생성 및 tooltip 활용

안녕하세요,

 

오늘은 AnyChart 로 막대그래프를 만들고 클릭 시 나타나는 tooltip의 색깔과 내용을 변경해보도록 하겠습니다. 

 

build.gradle(app) 추가

implementation 'com.github.AnyChart:AnyChart-Android:1.1.5'

 

 

settings.gradle에 maven { url 'https://jitpack.io' } 추가 

dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
        maven {
            url = uri("https://jitpack.io")
        }
    }
}

 

MainActivity.java

public class MainActivity extends AppCompatActivity {

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

        // AnyChartView 초기화
        AnyChartView anyChartView = findViewById(R.id.any_chart_view);

        // 차트 생성
        Cartesian barChart = AnyChart.column();

        // 데이터 추가
        List<DataEntry> data = new ArrayList<>();
        data.add(new ValueDataEntry("월", 120));
        data.add(new ValueDataEntry("화", 180));
        data.add(new ValueDataEntry("수", 90));
        data.add(new ValueDataEntry("목", 160));
        data.add(new ValueDataEntry("금", 130));
        data.add(new ValueDataEntry("토", 30));
        data.add(new ValueDataEntry("일", 190));


        // 데이터 설정
        Column column = barChart.column(data);

        // 툴팁 내용 설정: 값만 표시
        barChart.tooltip()
                .format("{%Value}") // 값만 표시
                .fontSize(14) // 툴팁 폰트 크기
                .fontColor("#FFFFFF") // 툴팁 텍스트 색상
                .background().fill("#4CAF50"); // 툴팁 배경색 설정
        // 클릭 시 강조 색상 설정
        barChart.interactivity().selectionMode("single"); // 한 번에 하나만 선택
        column.selected().fill("#FF5722", 1.0); // 클릭된 막대 색상

        // 기본 막대 색상
        column.normal().fill("#2196F3", 1.0); // 파란색 기본 색상

        // 차트 제목 설정
        barChart.title("테스트데이터");

        // X축 및 Y축 제목 설정
        barChart.xAxis(0).title("데이터");
        barChart.yAxis(0).title("값");

        // AnyChartView에 차트 설정
        anyChartView.setChart(barChart);
    }
}

 

 

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <!-- 차트를 표시할 AnyChartView -->
    <com.anychart.AnyChartView
        android:id="@+id/any_chart_view"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

</LinearLayout>

 

 

시연영상 입니다.