Results 1 to 3 of 3

Thread: How to create Verticle Bargraph in Android?

  1. #1

    Thread Starter
    Banned
    Join Date
    Nov 2016
    Location
    dehradun
    Posts
    3

    Post 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.

  2. #2
    New Member
    Join Date
    May 2017
    Location
    Bangalore
    Posts
    1

    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

  3. #3
    New Member
    Join Date
    May 2017
    Location
    Germany
    Posts
    15

    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
  •  



Click Here to Expand Forum to Full Width