{"id":3382,"date":"2017-05-08T05:18:18","date_gmt":"2017-05-08T05:18:18","guid":{"rendered":"https:\/\/www.cmarix.com\/blog\/?p=3382"},"modified":"2024-06-22T18:23:18","modified_gmt":"2024-06-22T18:23:18","slug":"how-to-integrate-chart-library-in-android-mobile-app","status":"publish","type":"post","link":"https:\/\/www.cmarix.com\/blog\/how-to-integrate-chart-library-in-android-mobile-app\/","title":{"rendered":"How to integrate chart library in Android mobile app"},"content":{"rendered":"<p>Extensive amounts of complicated data start to make sense when introduced graphically allowing stakeholders to take effective decisions. Raw data serves immense purpose when interpreted intelligently and co-related with additional data based on which meaningful conclusion can be derived. Having effective data &amp; analysis displayed graphically in mobile app is among standard business requirements.<\/p>\n<p>When you are developing <a href=\"https:\/\/www.cmarix.com\/android-app-development.html\">Android app development<\/a> for your business, one of the common UI components used is a chart. But drawing a chart through graphics could take a lot of time and would slow down your development as well as make big difference in user satisfaction. There are several good third party libraries available for adding charts to your Android app to give fast pace to your development.<\/p>\n<p><strong><a href=\"https:\/\/github.com\/PhilJay\/MPAndroidChart\/tree\/master\/MPChartLib\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">MPAndroidChart<\/a><\/strong> is one such library, very popular with Android developers based on community involvement and usage by more than 3K users on GitHub. It is one of the popular native charting libraries for Android with supporting Line Chart, Bar chart, Pie Chart, Bubble and candlestick charts as well as scaling, dragging, animations and many more full blown feature set. It also allows you to customize the charts as per you application requirement. Line chart is a type of MPAndroidChart library, represented by series of data points and connected by straight line. For implementing Line chart in Android application you have to create a simple project in Android studio and need to include MpAndroid library in Android application.<\/p>\n<p><strong>Read More: <\/strong><a href=\"https:\/\/www.cmarix.com\/blog\/how-to-integrate-fingerprint-api-in-android-mobile-app\/\">How to Integrate Fingerprint API in Android mobile app<\/a><\/p>\n<p>For creating New Project Select Go to File -&gt; New -&gt;New Projects in Android studio. In order to use the MpAndroid library, you need to implement library into android package. There are various options for that:<\/p>\n<ul>\n<li>Gradle dependency (recommended)<\/li>\n<li>Maven<\/li>\n<li>jar file only<\/li>\n<li>Clone whole repo<\/li>\n<\/ul>\n<p>We will use Gradle dependency in this blog. For that Add the following code to your project level file build.gradle:<\/p>\n<figure id=\"attachment_3383\" aria-describedby=\"caption-attachment-3383\" style=\"width: 717px\" class=\"wp-caption alignnone\"><img decoding=\"async\" class=\"wp-image-3383 size-full\" src=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/1.png\" alt=\"Gradle dependency\" width=\"717\" height=\"463\" srcset=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/1.png 717w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/1-300x194.png 300w\" sizes=\"(max-width: 717px) 100vw, 717px\" \/><figcaption id=\"caption-attachment-3383\" class=\"wp-caption-text\">Gradle dependency<\/figcaption><\/figure>\n<p>Now, we will create a <strong>setData()<\/strong> method. Within this method, we will populate X-axis value and Y-axis value in chart. For that, we will initialize <strong>LineDataSet<\/strong> and give within Data Type. We can set custom style of Line chart such as color,radius,line type and many more. Then create a data object with the datasets and pass this data object into <strong>setData()<\/strong> method of Line chart.<\/p>\n<figure id=\"attachment_3384\" aria-describedby=\"caption-attachment-3384\" style=\"width: 899px\" class=\"wp-caption alignnone\"><img decoding=\"async\" class=\"wp-image-3384 size-full\" src=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/2.png\" alt=\"SetData() method\" width=\"899\" height=\"484\" srcset=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/2.png 899w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/2-300x162.png 300w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/2-768x413.png 768w\" sizes=\"(max-width: 899px) 100vw, 899px\" \/><figcaption id=\"caption-attachment-3384\" class=\"wp-caption-text\">SetData() method<\/figcaption><\/figure>\n<figure id=\"attachment_3385\" aria-describedby=\"caption-attachment-3385\" style=\"width: 1080px\" class=\"wp-caption alignnone\"><img decoding=\"async\" class=\"wp-image-3385 size-full\" src=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/3.png\" alt=\"Android Line Chart\" width=\"1080\" height=\"1920\" srcset=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/3.png 1080w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/3-169x300.png 169w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/3-576x1024.png 576w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/3-768x1365.png 768w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/3-864x1536.png 864w\" sizes=\"(max-width: 1080px) 100vw, 1080px\" \/><figcaption id=\"caption-attachment-3385\" class=\"wp-caption-text\">Android Line Chart<\/figcaption><\/figure>\n<p>To draw upper and lower limit line, we need to create <strong>LimitLine<\/strong> object with limit value and text. Pass it into <strong>addLimitLine()<\/strong> method of Y-axis. We can also set limit text size, line width, set the label position and enable dash line etc.<\/p>\n<figure id=\"attachment_3386\" aria-describedby=\"caption-attachment-3386\" style=\"width: 907px\" class=\"wp-caption alignnone\"><img decoding=\"async\" class=\"wp-image-3386 size-full\" src=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/4.png\" alt=\"addLimitLine() method\" width=\"907\" height=\"582\" srcset=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/4.png 907w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/4-300x193.png 300w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/4-768x493.png 768w\" sizes=\"(max-width: 907px) 100vw, 907px\" \/><figcaption id=\"caption-attachment-3386\" class=\"wp-caption-text\">addLimitLine() method<\/figcaption><\/figure>\n<figure id=\"attachment_3387\" aria-describedby=\"caption-attachment-3387\" style=\"width: 1080px\" class=\"wp-caption alignnone\"><img decoding=\"async\" class=\"wp-image-3387 size-full\" src=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/5.png\" alt=\"addLimitLine() method\" width=\"1080\" height=\"1920\" srcset=\"https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/5.png 1080w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/5-169x300.png 169w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/5-576x1024.png 576w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/5-768x1365.png 768w, https:\/\/www.cmarix.com\/blog\/wp-content\/uploads\/2017\/05\/5-864x1536.png 864w\" sizes=\"(max-width: 1080px) 100vw, 1080px\" \/><figcaption id=\"caption-attachment-3387\" class=\"wp-caption-text\">addLimitLine() method<\/figcaption><\/figure>\n<p>Charts are a standard approach to present complicated data sets. Everything seems to be easier when you present it in on a chart. A picture is worth of thousand words and it is very true in regards to charts. Using charts to display data can help users understand the information more effortlessly than they would if it were presented in a table, especially when dealing with a lot of data. One of the key benefits of Android mobile app development is the availability of free third part libraries like we have used in above scenario. <a href=\"https:\/\/www.cmarix.com\/hire-android-developers.html\"><strong>Hire android developer<\/strong><\/a> who has good experience of smart approach which can be implemented in mobile app development leveraging third party libraries and APIs whenever required.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Extensive amounts of complicated data start to make sense when introduced graphically [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":3390,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[18],"tags":[],"class_list":["post-3382","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-android-app-development"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/posts\/3382","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/comments?post=3382"}],"version-history":[{"count":6,"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/posts\/3382\/revisions"}],"predecessor-version":[{"id":38191,"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/posts\/3382\/revisions\/38191"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/media\/3390"}],"wp:attachment":[{"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/media?parent=3382"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/categories?post=3382"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.cmarix.com\/blog\/wp-json\/wp\/v2\/tags?post=3382"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}