-
Dec 12th, 2016, 05:13 AM
#1
Thread Starter
Banned
How to create Verticle Bargraph in Android?
Hi, As you all know that, Android is a mobile operating system based on the Linux kernel and designed primarily for touchscreen mobile devices such as smartphones and tablets. While working on Android applications, I encountered an issue where I need to create a verticle bargraph which can be rotated vertically & horizontally. I have searched in many android developer forum for this solutions but still issue remains the same. Hoping to get a solution from the fellow tech experts.
-
May 28th, 2017, 05:55 AM
#2
New Member
Re: How to create Verticle Bargraph in Android?
Introduction
A Bar chart or bar graph is a chart that presents grouped data with rectangular bars with lengths proportional to the values that they represent. The bars can be plotted vertically or horizontally. A vertical bar chart is sometimes called a column bar chart.
In this tutorial, we will implement Bar chart using MpAndroid library in Android application. We will cover all series of Bar chart. For that, we will create a simple Android application in Android studio and also need to include MpAndroid library in Android application.
Create a new project
To implement Bar chart, we are going to create a new android project. Go to File ⇒ New ⇒ New Projects in Android studio.
Add MpAndroid library
We need to add MpAndroid library in our project, so open build.gradle(Module:app) file and add following code:
1
2
3
4
5
6
7
8
9
repositories {
maven { url "https://jitpack.io" }
}
dependencies {
.....
compile 'com.github.PhilJay:MPAndroidChart:v2.2.4'
.....
}
Create Layout
We can create two types Vertical and Horizontal Bar Chart. Vertical Bar Chart means the chart will be plotted Labels to X-axis and Numeric data to Y-axis. Horizontal Bar chart means a chart will be plotted Labels to Y-axis and Numeric data to X-axis. We need to use com.github.mikephil.charting.charts.BarChart XML tag for the Vertical Bar Chart and github.mikephil.charting.charts.HorizontalBarChart XML tag for Horizontal Bar Chart In the layout XML fil.
For Vertical Bar Chart
1
2
3
4
<com.github.mikephil.charting.charts.BarChart
android:id="@+id/barchart"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
For Horizontal Bar Chart
1
2
3
4
<com.github.mikephil.charting.charts.HorizontalBarChart
android:id="@+id/barchart"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
Initialize Bar Chart
We need to initialize Bar chart in MainActivity.java file to display Charts.
For Vertical Bar Chart
1
BarChart barChart = (BarChart) findViewById(R.id.barchart);
For Horizontal Bar Chart
1
HorizontalBarChart barChart = (HorizontalBarChart) findViewById(R.id.barchart);
Create an ArrayList
We are going to store all data into an array and this data will populate into Chart. For that, we need to initialize an ArrayList. Every individual value of the data should be represented as a BarEntry. These BarEntry will store in an ArrayList.
1
2
3
4
5
6
ArrayList<String> labels = new ArrayList<String>();
labels.add("2016");
labels.add("2015");
labels.add("2014");
labels.add("2013");
labels.add("2012");
Initialize BarDataSet Object
To display the data in a Bar chart, we need to initialize a BarDataSet instance. BarDataSet is the Subclass of DataSet class. Now, initialize the BarDataSet and pass the argument as an ArrayList of BarEntry object.
1
BarDataSet bardataset = new BarDataSet(entries, "Cells");
Define Labels
Without using labels, there is no meaningful sense of already added value to the chart. We can use an ArrayList to store labels.
1
2
3
4
5
6
7
ArrayList<String> labels = new ArrayList<String>();
labels.add("2016");
labels.add("2015");
labels.add("2014");
labels.add("2013");
labels.add("2012");
labels.add("2011");
Populate Data into Chart
To load the data into Bar Chart, We need to initialize BarData object with argument labels and bardataset. These BarData object pass into setData() method to load Bar Chart with data.
1
2
BarData data = new BarData(labels, bardataset);
barChart.setData(data); // set the data and list of labels into chart
Set the Description
To add description in the Bar Chart, we need to call setDescription(“Your Description”) method. Run your app in any Android Device to see Bar Chart.
1
barChart.setDescription("Set Bar Chart Description"); // set the description
Vertical Bar Chart
bar_chart
Horizontal Bar Chart
horizontal_bar_chart
Set the Color
This library provides the number of predefined color templates that change the color of data set without having to deal with individual color values.
1
bardataset.setColors(ColorTemplate.COLORFUL_COLORS);
Vertical Bar Chart
bar_chart1
Horizontal Bar Chart
horizontal_bar_chart1
Adding Animations
This library supports animation, to make your charts appear more lively. The animateXY method is used to animate both axes of the chart. If you want to animate only one of the axes, you can use animateX oranimateY to animate the x-axis or y-axis respectively. You have to specify the duration (in milliseconds) of the animation when you call these methods. For example, to only animate the y-Axis, add the following code snippet:
1
barChart.animateY(5000);
MultiSeries Bar Chart
To create Multi-Series Bar Chart, We need to create individual DataSet and these dataset combined into an ArrayList. Type of this ArrayList is BarDataSet. Now, we will initialize the BarData object with argument list of labels and list of DataSet. Set the BarData into chart via setData();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
// create BarEntry for Bar Group 1
ArrayList<BarEntry> bargroup1 = new ArrayList<>();
bargroup1.add(new BarEntry(8f, 0));
bargroup1.add(new BarEntry(2f, 1));
bargroup1.add(new BarEntry(5f, 2));
bargroup1.add(new BarEntry(20f, 3));
bargroup1.add(new BarEntry(15f, 4));
bargroup1.add(new BarEntry(19f, 5));
// create BarEntry for Bar Group 1
ArrayList<BarEntry> bargroup2 = new ArrayList<>();
bargroup2.add(new BarEntry(6f, 0));
bargroup2.add(new BarEntry(10f, 1));
bargroup2.add(new BarEntry(5f, 2));
bargroup2.add(new BarEntry(25f, 3));
bargroup2.add(new BarEntry(4f, 4));
bargroup2.add(new BarEntry(17f, 5));
// creating dataset for Bar Group1
BarDataSet barDataSet1 = new BarDataSet(bargroup1, "Bar Group 1");
//barDataSet1.setColor(Color.rgb(0, 155, 0));
barDataSet1.setColors(ColorTemplate.COLORFUL_COLORS);
// creating dataset for Bar Group 2
BarDataSet barDataSet2 = new BarDataSet(bargroup2, "Bar Group 2");
barDataSet2.setColors(ColorTemplate.COLORFUL_COLORS);
ArrayList<String> labels = new ArrayList<String>();
labels.add("2016");
labels.add("2015");
labels.add("2014");
labels.add("2013");
labels.add("2012");
labels.add("2011");
ArrayList<BarDataSet> dataSets = new ArrayList<>(); // combined all dataset into an arraylist
dataSets.add(barDataSet1);
dataSets.add(barDataSet2);
// initialize the Bardata with argument labels and dataSet
BarData data = new BarData(labels, dataSets);
barChart.setData(data);
Vertical Bar Chart
multiseries_bar_chart
Horizontal Bar Chart
multiseries_bar chart1
-
May 31st, 2017, 04:10 AM
#3
New Member
Re: How to create Verticle Bargraph in Android?
Awesome explanation, I was having a similiar problem so thanks
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|