How to create charts in android | PART 1 | Bar Chart | Pie Chart | Radar Chart | MP Android Chart | Android Studio | Java

7 min readDec 25, 2020

What is Chart?

A chart is a graphical representation of data, in which “the data is represented by symbols, such as bars in a bar chart, lines in a line chart, or slices in a pie chart”. A chart can represent tabular numeric data, functions, or some kind of quality structure and provides different info.

Why use Chart?

The main functions of a chart are to display data and invite further exploration of a topic. Charts are used in situations where a simple table won’t adequately demonstrate important relationships or patterns between data points.

Android Charts Example (PART 1)

Gradle Setup

in build.gradle Project file:

repositories {
maven { url ‘https://jitpack.io' }
}

in build.gradle App file:

dependencies {
implementation ‘com.github.PhilJay:MPAndroidChart:v3.1.0’
}

Main Activity Setup

in the main activity XML file, we add three buttons for the Bar, Pie, and Radar charts with a definition.

<?xml version=”1.0" encoding=”utf-8"?>
<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android"
xmlns:app=”http://schemas.android.com/apk/res-auto"
xmlns:tools=”http://schemas.android.com/tools"
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:padding=”20dp”
android:orientation=”vertical”
tools:context=”.MainActivity”>
<TextView
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”@string/bar_chart_text”
android:textColor=”@color/black”
android:layout_gravity=”center_horizontal”
android:layout_marginBottom=”8dp”/>
<Button
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:id=”@+id/barChatButton”
android:backgroundTint=”@color/purple_500"
android:textColor=”@color/white”
android:text=”@string/bar_chart”/>
<TextView
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”@string/pie_chart_text”
android:textColor=”@color/black”
android:layout_gravity=”center_horizontal”
android:layout_marginBottom=”8dp”
android:layout_marginTop=”20dp”/>
<Button
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:id=”@+id/pieChatButton”
android:backgroundTint=”@color/purple_500"
android:textColor=”@color/white”
android:text=”@string/pie_chart”/>
<TextView
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:text=”@string/radar_chart_text”
android:textColor=”@color/black”
android:layout_gravity=”center_horizontal”
android:layout_marginBottom=”8dp”
android:layout_marginTop=”20dp”/>
<Button
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:id=”@+id/radarChatButton”
android:backgroundTint=”@color/purple_500"
android:textColor=”@color/white”
android:text=”@string/radar_chart”/>
</LinearLayout>

now in the main activity java file, set onClickListener in the buttons to the Bar, Pie, and Radar activities.

public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
findViewById(R.id.barChatButton).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
startActivity(new Intent(getApplicationContext(), BarChartActivity.class));
}
});
findViewById(R.id.pieChatButton).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
startActivity(new Intent(getApplicationContext(), PieChartActivity.class));
}
});
findViewById(R.id.radarChatButton).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
startActivity(new Intent(getApplicationContext(), RadarChartActivity.class));
}
});
}
}

the output of the main activity:

Bar chart Activity

apply the bar chart in the XML file

<?xml version=”1.0" encoding=”utf-8"?>
<androidx.core.widget.NestedScrollView
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:gravity=”center”
android:padding=”20dp”
tools:context=”.BarChartActivity”>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:layout_marginBottom=”20dp”
android:orientation=”vertical”>
<com.github.mikephil.charting.charts.BarChart
android:layout_width=”match_parent”
android:layout_height=”400dp”
android:id=”@+id/barChart”
android:layout_marginBottom=”20dp”/>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginBottom=”20dp”
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginBottom=”10dp”
android:text=”Bar Chart Example”
android:textColor=”@color/black”
android:textSize=”20sp”
android:textStyle=”bold” />
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”20dp”>
<ImageView
android:id=”@+id/input”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/green” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input”
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2010"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 350"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input1"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/yellow” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input1"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2011"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 475"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input2"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/redish” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input2"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2012"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 570"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input3"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/blue” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input3"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2013"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 650"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input5"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/green” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input5"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2014"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 211"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input6"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/yellow” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input6"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2015"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 855"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input7"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/redish” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input7"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2016"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 360"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input8"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/blue” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input8"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2017"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 660"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
</androidx.core.widget.NestedScrollView>

now calls the bar chart and adds the data to the bar chart.

public class BarChartActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_bar_chart);
setTitle(“Bar Chart”);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
BarChart barChart = findViewById(R.id.barChart);
ArrayList<BarEntry> entries = new ArrayList<>();
entries.add(new BarEntry(2010,350));
entries.add(new BarEntry(2011,475));
entries.add(new BarEntry(2012,570));
entries.add(new BarEntry(2013,650));
entries.add(new BarEntry(2014,211));
entries.add(new BarEntry(2015,855));
entries.add(new BarEntry(2016,360));
entries.add(new BarEntry(2017,660));
BarDataSet barDataSet = new BarDataSet(entries, “Entries”);
barDataSet.setColors(ColorTemplate.MATERIAL_COLORS);
barDataSet.setValueTextColor(Color.BLACK);
barDataSet.setValueTextSize(16f);
BarData barData = new BarData(barDataSet);
barChart.setFitBars(true);
barChart.setData(barData);
barChart.getDescription().setText(“Custom Bar Chart Example”);
barChart.animateY(2000);
}
}

the output of the bar chart activity:

Pie chart activity

apply the pie chart in the XML file

<?xml version=”1.0" encoding=”utf-8"?>
<androidx.core.widget.NestedScrollView 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:gravity=”center”
android:padding=”20dp”
tools:context=”.PieChartActivity”>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:layout_marginBottom=”20dp”
android:orientation=”vertical”>
<com.github.mikephil.charting.charts.PieChart
android:id=”@+id/pieChart”
android:layout_width=”match_parent”
android:layout_height=”450dp”
android:layout_marginBottom=”10dp” />
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginBottom=”20dp”
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginBottom=”10dp”
android:text=”Pie Chart Example”
android:textColor=”@color/black”
android:textSize=”20sp”
android:textStyle=”bold” />
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”20dp”>
<ImageView
android:id=”@+id/input”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/green” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input”
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2012"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 200"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input1"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/yellow” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input1"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2013"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 350"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input2"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/redish” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input2"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2014"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 480"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input3"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/blue” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input3"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2015"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 120"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input5"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/green” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input5"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry year”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2016"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_alignParentEnd=”true”
android:layout_centerVertical=”true”
android:layout_marginEnd=”10dp”
android:text=”Entries: 260"
android:textColor=”@color/black”
android:textSize=”16sp”
android:textStyle=”bold” />
</RelativeLayout>
</LinearLayout>
</LinearLayout>
</androidx.core.widget.NestedScrollView>

now call the pie chart and add the data to it.

public class PieChartActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_pie_chart);
setTitle(“Pie Chart”);
PieChart pieChart = findViewById(R.id.pieChart);
ArrayList<PieEntry> entries = new ArrayList<>();
entries.add(new PieEntry(200,2012));
entries.add(new PieEntry(350,2013));
entries.add(new PieEntry(480,2014));
entries.add(new PieEntry(120,2015));
entries.add(new PieEntry(260,2016));
PieDataSet pieDataSet = new PieDataSet(entries, “Entries”);
pieDataSet.setColors(ColorTemplate.MATERIAL_COLORS);
pieDataSet.setValueTextColor(Color.BLACK);
pieDataSet.setValueTextSize(16f);
PieData pieData = new PieData(pieDataSet);
pieChart.setData(pieData);
pieChart.getDescription().setEnabled(false);
pieChart.setCenterText(“Entries”);
pieChart.animate();
}
}

the output of the pie chart activity:

Radar chart activity

add the radar chart in the XML file

<?xml version=”1.0" encoding=”utf-8"?>
<androidx.core.widget.NestedScrollView
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:padding=”20dp”
android:gravity=”center”
tools:context=”.RadarChartActivity”>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:layout_marginBottom=”20dp”
android:orientation=”vertical”>
<com.github.mikephil.charting.charts.RadarChart
android:layout_width=”match_parent”
android:layout_height=”400dp”
android:id=”@+id/radarChart”
android:layout_marginBottom=”20dp”/>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginBottom=”20dp”
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginBottom=”10dp”
android:text=”Radar Chart Example”
android:textColor=”@color/black”
android:textSize=”20sp”
android:textStyle=”bold” />
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”20dp”>
<ImageView
android:id=”@+id/input”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/red” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input”
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry No”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”1"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:layout_marginTop=”10dp”>
<ImageView
android:id=”@+id/input1"
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_centerVertical=”true”
android:layout_marginStart=”10dp”
android:src=”@drawable/black” />
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_toEndOf=”@+id/input1"
android:orientation=”vertical”>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:text=”Entry No”
android:textSize=”11sp” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginStart=”16dp”
android:gravity=”center”
android:text=”2"
android:textAlignment=”center”
android:textColor=”@color/black”
android:textSize=”15sp”
android:textStyle=”bold” />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
</androidx.core.widget.NestedScrollView>

now, call the radar chart and add two entries.

public class RadarChartActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_radar_chart);
setTitle(“Radar Chart”);
RadarChart radarChart = findViewById(R.id.radarChart);
//entry 1
ArrayList<RadarEntry> entries = new ArrayList<>();
entries.add(new RadarEntry(220));
entries.add(new RadarEntry(330));
entries.add(new RadarEntry(440));
entries.add(new RadarEntry(550));
entries.add(new RadarEntry(660));
entries.add(new RadarEntry(210));
entries.add(new RadarEntry(350));
entries.add(new RadarEntry(120));
RadarDataSet radarDataSet = new RadarDataSet(entries,”Entry 1");
radarDataSet.setColor(Color.RED);
radarDataSet.setLineWidth(2f);
radarDataSet.setValueTextColor(Color.RED);
radarDataSet.setValueTextSize(14f);
//entry 2
ArrayList<RadarEntry> entries2 = new ArrayList<>();
entries2.add(new RadarEntry(120));
entries2.add(new RadarEntry(310));
entries2.add(new RadarEntry(340));
entries2.add(new RadarEntry(450));
entries2.add(new RadarEntry(560));
entries2.add(new RadarEntry(310));
entries2.add(new RadarEntry(650));
entries2.add(new RadarEntry(320));
RadarDataSet radarDataSet2 = new RadarDataSet(entries2,”Entry 2");
radarDataSet2.setColor(Color.BLUE);
radarDataSet2.setLineWidth(2f);
radarDataSet2.setValueTextColor(Color.BLUE);
radarDataSet2.setValueTextSize(14f);
//set the data
RadarData radarData = new RadarData();
radarData.addDataSet(radarDataSet);
radarData.addDataSet(radarDataSet2);
String[] labels = {“2010”,”2011",”2012",”2013",”2014",”2015",”2016",”2017"};
XAxis xAxis = radarChart.getXAxis();
xAxis.setValueFormatter(new IndexAxisValueFormatter(labels));
radarChart.getDescription().setText(“Custom Radar Chart Example”);
radarChart.setData(radarData);
}
}