B4A Library MPAndroidCharts - Various type of graphs / charts (Latest library V1.22 in post #1)

Edit 6 Sep 2015: Post #3 adds Single Vertical Bar Charts and update for Pie Charts
Edit 8 Sep 2015 Post #6 update for Single Vertical Bar Charts
Edit 11 Sep 2015 Post #7 adds Single Line Charts
Edit 12 Sep 2015 Post #8 update for Single Line Charts
Edit 12 Sep 2015 Post #9 adds Single Horizontal Bar Charts
Edit 12 Sep 2015 Post #11 adds Radar Charts
Edit 13 Sep 2015 Post #12 update for Single Line and Single Bar Charts
Edit 14 Sep 2015 Post #16 update for Radar Charts
Edit 16 Sep 2015 Post #19 adds Multiple Line Charts
Edit 17 Sep2016 Post #21 adds Multi Vertical Bar Charts
Edit 19 Sep 2015 Post #23 adds Multi Bubble Charts
Edit 19 Sep 2015 Post #24 adds Multi Horizontal Bar Charts
Edit 19 Sep 2015 Post #25 adds Multi Scatter Charts
Edit 19 Sep 2015 Post #26 adds Stacked Bar Charts
Edit 20 Sep 2015 Post #27 adds Candlestick Charts
Edit 20 Sep 2015 Post #28 adds Combined Line & Bar Charts
Edit 23 Sep 2015 Post #31 fixed no-show of Chart Title for Combined Charts and added ability to rotate X-axis labels between -30 and + 30 degrees

I am busy wrapping this Github project. Attached is the Pie Chart functionality of the project/library. Posting the B4A project and Library files. Copy the library files to your additional library folder.

Some remarks about the Pie Chart:
1. It will display the values passed as a percentage of the total of the values that you pass
2. There are 3 x arrays that are passed to the library. Ensure that you pass the same number of elements in each of the arrays.
3. When you click on a pie slice the slice will increase in radial size (see pics below)
4. If you click on the radial increased slice it will return to normal size.
5. You can spin the pie chart around its centre point (CW and ACW) with your finger.

Untouched ...

Green slice touched ...

Pie Chart rotated with finger...

Some sample code:

#Region  Project Attributes
    #ApplicationLabel: MPChart
    #VersionCode: 1
    #VersionName:
    'SupportedOrientations possible values: unspecified, landscape or portrait.
    #SupportedOrientations: landscape
    #CanInstallToExternalStorage: False
#End Region

#Region  Activity Attributes
    #FullScreen: False
    #IncludeTitle: True
#End Region

Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.

End Sub

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.

    Private mpc1 As PieChart
End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("main")

mpc1.DrawHoleEnabled = True
mpc1.HoleColorTransparent = True

mpc1.TransparentCircleColor = Colors.White
mpc1.TransparentCircleAlpha = 110

mpc1.HoleRadius = 58.0
mpc1.TransparentCircleRadius = 61.0

mpc1.DrawCenterText = True

mpc1.CenterText = "Wrapped by Johan"
mpc1.CenterTextColor = Colors.White
mpc1.CenterTextRadiusPercent = 100.0
mpc1.CenterTextSize = 15.0

mpc1.DrawSliceText = True
mpc1.HoleColor = Colors.Black
mpc1.TransparentCircleColor = Colors.Transparent

mpc1.setTheLegendPosition
mpc1.TheLegendColor = Colors.yellow
mpc1.TheLegendTextSize = 12.0
mpc1.LegendTitle = "MONTHS"

mpc1.ChartDescription = "TITLE : Some Arbitrary Data"
mpc1.ChartDescriptionColor = Colors.ARGB(200,0,255,255)
mpc1.ChartDescriptionTextSize = 17

mpc1.ValueTextColor = Colors.Black
mpc1.ValueTextSize = 15.0

mpc1.PieColors = Array As Int(Colors.Blue, Colors.Yellow, Colors.Green, Colors.Red, Colors.Magenta, Colors.Cyan)
mpc1.LegendText = Array As String("Jan", "Feb", "Mar", "Apr", "May", "Jun")
mpc1.ChartData = Array As Float(128.0, 16.0, 46.0, 40.0, 30.0, 40.0)    'values - it will be converted to %

mpc1.PieData = 6

End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub

 

[Johan Schoeman]

I mean in the prev post - it would be super, if to just add mlc1.Chart_x_Alias like mlc1.Chart_x_Data. And draw using _Data, but _Alias for showing on the marker.
This will allow to combine not only digit line charts, but any event lines.

Why don't you use the secondary y-axis....

 

[peacemaker]

I need to detailed compare 7 lines that each of various values range. Pressure, humidity, temperature....
At the same scale, but absolute values are important just after comparision.
So, values for drawing are of various ranges, but should ein the same scale, and absolute values should also be readable, on marker.

 

[Ricardo Escalante]

Hi, how are you? Could you help me with the next problem, please?
Running the application throws me the next dump, trying to generate a bar graph and almost the same with the graph pay

Library ver. installed 1.06
B4A ver. 7.3 Beta#1

main_cargadatosbarra (B4A line: 201)
barra.LegendShapeSize = 7.0 'this line of
java.lang.NullPointerException: Attempt to invoke virtual method 'void android.view.View.invalidate()' on a null object reference
at mpandroidchartwrapper.barChartWrapper.setLegendShapeSize(barChartWrapper.java:422)
at com.easypoll.main._cargadatosbarra(main.java:515)
at com.easypoll.main._lstoficinas_itemclick(main.java:874)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:186)
at anywheresoftware.b4a.BA$1.run(BA.java:325)
at android.os.Handler.handleCallback(Handler.java:751)
at android.os.Handler.dispatchMessage(Handler.java:95)
at android.os.Looper.loop(Looper.java:154)
at android.app.ActivityThread.main(ActivityThread.java:6123)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:867)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:757)
java.lang.NullPointerException: Attempt to invoke virtual method 'void android.view.View.invalidate()' on a null object reference

I really appreciate your time and response.

 

[Johan Schoeman]

Hi, how are you? Could you help me with the next problem, please?
Running the application throws me the next dump, trying to generate a bar graph and almost the same with the graph pay

Library ver. installed 1.06
B4A ver. 7.3 Beta#1

main_cargadatosbarra (B4A line: 201)
barra.LegendShapeSize = 7.0 'this line of
java.lang.NullPointerException: Attempt to invoke virtual method 'void android.view.View.invalidate()' on a null object reference
at mpandroidchartwrapper.barChartWrapper.setLegendShapeSize(barChartWrapper.java:422)
at com.easypoll.main._cargadatosbarra(main.java:515)
at com.easypoll.main._lstoficinas_itemclick(main.java:874)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:186)
at anywheresoftware.b4a.BA$1.run(BA.java:325)
at android.os.Handler.handleCallback(Handler.java:751)
at android.os.Handler.dispatchMessage(Handler.java:95)
at android.os.Looper.loop(Looper.java:154)
at android.app.ActivityThread.main(ActivityThread.java:6123)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:867)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:757)
java.lang.NullPointerException: Attempt to invoke virtual method 'void android.view.View.invalidate()' on a null object reference

I really appreciate your time and response.

Ricardo - is it your own project that gives you the error or my demo project?

See what the attached lib files does. I have no problem with the barcode part of the library when running my demo project.

Sample Code:

#Region  Project Attributes
    #ApplicationLabel: MPBarChart
    #VersionCode: 1
    #VersionName:
    'SupportedOrientations possible values: unspecified, landscape or portrait.
    #SupportedOrientations: landscape
    #CanInstallToExternalStorage: False
#End Region

#Region  Activity Attributes
    #FullScreen: False
    #IncludeTitle: True
#End Region

Sub Process_Globals
    'These global variables will be declared once when the application starts.
    'These variables can be accessed from all modules.

End Sub

Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.

    Private mbc1 As BarChart
    Dim prevval As Float = 0.0
  
    Private Label1 As Label
End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Do not forget to load the layout file created with the visual designer. For example:
    Activity.LoadLayout("main")
  
    Label1.Text = "Value = "
  
'    RIGHT_OF_CHART, RIGHT_OF_CHART_CENTER, RIGHT_OF_CHART_INSIDE,
'    LEFT_OF_CHART, LEFT_OF_CHART_CENTER, LEFT_OF_CHART_INSIDE,
'    BELOW_CHART_LEFT, BELOW_CHART_RIGHT, BELOW_CHART_CENTER,

'   LINE, CIRCLE, SQUARE
    mbc1.LegendShapeSize = 7.0        'this line of code needs to be before mbc1.setTheLegendPositionAndForm("BELOW_CHART_CENTER", "CIRCLE")
    mbc1.setTheLegendPositionAndForm("BELOW_CHART_CENTER", "CIRCLE")    'pass strings from the above comments
  
    mbc1.TheLegendColor = Colors.yellow
    mbc1.TheLegendTextSize = 20.0
    mbc1.LegendTitle = "Months"

    mbc1.ChartDescription = "TITLE : Some Arbitrary Data"
    mbc1.ChartDescriptionColor = Colors.Black
    mbc1.ChartDescriptionTextSize = 15
'    mbc1.setDescriptionPosition(mbc1.left + 25%x ,mbc1.top + 3%y)
  
    mbc1.ValueTextColor = Colors.Black
    mbc1.ValueTextSize = 9.0
  


    'the following 3 arrays must have the same number of entries/elements
    mbc1.BarColors = Array As Int(Colors.Blue, Colors.Yellow, Colors.Green, Colors.Red, Colors.Magenta, Colors.Cyan, Colors.Blue, Colors.Yellow, Colors.Green, Colors.Red, Colors.Magenta, Colors.Cyan, _
                                  Colors.Blue, Colors.Yellow, Colors.Green, Colors.Red, Colors.Magenta, Colors.Cyan, Colors.Blue, Colors.Yellow, Colors.Green, Colors.Red, Colors.Magenta, Colors.Cyan)
    mbc1.LegendText = Array As String("1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20","21", "22", "23", "24")
    mbc1.ChartData = Array As Float(52.0, 58.0, 63.0, 70.0, 48.0, 38.0, 25.0, 53.0, 66.0, 46.0, 67.0, 75.0, 52.0, 58.0, 63.0, 70.0, 48.0, 38.0, 25.0, 53.0, 66.0, 46.0, 67.0, 75.0)    'values - it will be converted to %

    mbc1.DoubleTapToZoomEnabled = True
    mbc1.DrawBarShadow = False
    mbc1.GridBackgroundColor = Colors.white
    mbc1.DrawBorders = True
    mbc1.DrawGridBackground = True
    mbc1.DrawHighlightArrow = True
    mbc1.DrawValueAboveBar = True
    mbc1.PinchZoom = True
    mbc1.ScaleEnabled = True
    mbc1.BorderColor = Colors.Yellow
    mbc1.BorderWidth = 3.0

'   TOP, BOTTOM, BOTH_SIDED, TOP_INSIDE, BOTTOM_INSIDE
    mbc1.XaxisLabelPosition = "BOTTOM"
    mbc1.XaxisTextSize = 15.0
    mbc1.XaxisTextColor = Colors.Magenta
  
    mbc1.DrawYaxisGridLines = True
    mbc1.YaxisTextColor = Colors.Green
    mbc1.YaxisTextSize = 15.0
    mbc1.ShowYaxisLeftLabels = True
    mbc1.ShowYaxisRightLabels = False
    mbc1.MarkerToUse = 1
  
    mbc1.YAxisMinValue = 0                           'ADDED 29 October 2015
    mbc1.YAxisMaxValue = 100                          'ADDED 29 October 2015
  
    mbc1.YAnimate = True
    mbc1.ChartAnimationTime = 2000

  
    mbc1.BarData = 24   'this number must be the same as the number of elements in the above arrays

End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub

Sub mbc1_bar_value(val As Float, index As Int)
  
    If prevval <> val Then
        Log("Current Value = " & val & ": Index = " & index)
      Label1.Text = "Value = " & val & ": Index = " & index
      prevval = val
    End If
  
End Sub

Take note of the comment in the code:

'   LINE, CIRCLE, SQUARE
    mbc1.LegendShapeSize = 7.0        'this line of code needs to be before mbc1.setTheLegendPositionAndForm("BELOW_CHART_CENTER", "CIRCLE")

 

[Ricardo Escalante]

Thanks so much for the response!
Let me try to explain me (sorry for my english)

Error, is it in my own project, i used your code sample just to load some data, but if i upgrade the library to 1.06 or 1.07(post #126)gives me the error.
Both pie and barrs charts
At pie chart,

pay.PieColors = Array As Int(Colors.Green, Colors.Yellow, Colors.Red)
pay.LegendText = Array As String("Bien", "Regular", "Mal")
pay.ChartData = Array As Float(60.0, 26.0, 46.0) 'values - it will be converted to %
pay.PieData = 3

throws error in line: pay.PieData = 3

Rigth now i works with 1.0 Post#3 and works fine.

Although I would like to work with 1.06

Again, thank you very much

 

[Johan Schoeman]

Thanks so much for the response!
Let me try to explain me (sorry for my english)

Error, is it in my own project, i used your code sample just to load some data, but if i upgrade the library to 1.06 or 1.07(post #126)gives me the error.
Both pie and barrs charts
At pie chart,

pay.PieColors = Array As Int(Colors.Green, Colors.Yellow, Colors.Red)
pay.LegendText = Array As String("Bien", "Regular", "Mal")
pay.ChartData = Array As Float(60.0, 26.0, 46.0) 'values - it will be converted to %
pay.PieData = 3

throws error in line: pay.PieData = 3

Rigth now i works with 1.0 Post#3 and works fine.

Although I would like to work with 1.06

Again, thank you very much

Try the lib files in post #304 above - it is version 1.08

 

[Ricardo Escalante]

the same error:

main_cargapay (B4A line: 221)
pay.PieData = 3
android.content.res.Resources$NotFoundException: Resource ID #0x0
at android.content.res.ResourcesImpl.getValue(ResourcesImpl.java:190)
at android.content.res.Resources.loadXmlResourceParser(Resources.java:2094)
at android.content.res.Resources.getLayout(Resources.java:1111)
at android.view.LayoutInflater.inflate(LayoutInflater.java:424)
at android.view.LayoutInflater.inflate(LayoutInflater.java:377)
at com.github.mikephil.charting.components.MarkerView.setupLayoutResource(MarkerView.java:39)
at com.github.mikephil.charting.components.MarkerView.<init>(MarkerView.java:29)
at com.github.mikephil.charting.components.MyMarkerView.<init>(MyMarkerView.java:30)
at mpandroidchartwrapper.pieChartWrapper.setPieData(pieChartWrapper.java:219)
at com.easypoll.main._cargapay(main.java:690)
at com.easypoll.main._lstoficinas_itemclick(main.java:848)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:186)
at anywheresoftware.b4a.BA$1.run(BA.java:325)
at android.os.Handler.handleCallback(Handler.java:751)
at android.os.Handler.dispatchMessage(Handler.java:95)
at android.os.Looper.loop(Looper.java:154)
at android.app.ActivityThread.main(ActivityThread.java:6123)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:867)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:757)


As well as downloading the library and the xml copy them in C: \ Program Files (x86) \ Anywhere Software \ Basic4android \ Libraries.
Maybe something is missing or doing wrong

Thanks!!

 

[Johan Schoeman]

the same error:

main_cargapay (B4A line: 221)
pay.PieData = 3
android.content.res.Resources$NotFoundException: Resource ID #0x0
at android.content.res.ResourcesImpl.getValue(ResourcesImpl.java:190)
at android.content.res.Resources.loadXmlResourceParser(Resources.java:2094)
at android.content.res.Resources.getLayout(Resources.java:1111)
at android.view.LayoutInflater.inflate(LayoutInflater.java:424)
at android.view.LayoutInflater.inflate(LayoutInflater.java:377)
at com.github.mikephil.charting.components.MarkerView.setupLayoutResource(MarkerView.java:39)
at com.github.mikephil.charting.components.MarkerView.<init>(MarkerView.java:29)
at com.github.mikephil.charting.components.MyMarkerView.<init>(MyMarkerView.java:30)
at mpandroidchartwrapper.pieChartWrapper.setPieData(pieChartWrapper.java:219)
at com.easypoll.main._cargapay(main.java:690)
at com.easypoll.main._lstoficinas_itemclick(main.java:848)
at java.lang.reflect.Method.invoke(Native Method)
at anywheresoftware.b4a.BA.raiseEvent2(BA.java:186)
at anywheresoftware.b4a.BA$1.run(BA.java:325)
at android.os.Handler.handleCallback(Handler.java:751)
at android.os.Handler.dispatchMessage(Handler.java:95)
at android.os.Looper.loop(Looper.java:154)
at android.app.ActivityThread.main(ActivityThread.java:6123)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:867)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:757)


As well as downloading the library and the xml copy them in C: \ Program Files (x86) \ Anywhere Software \ Basic4android \ Libraries.
Maybe something is missing or doing wrong

Thanks!!

You are missing the resource files in the /Objects/res folder - I guess. They need to be set to READ ONLY BEFORE you run the B4A project else the files in the /Object/res folder will get deleted when you compile the B4A project

 

[Ricardo Escalante]

This is the project.

 

[Johan Schoeman]

This is the project.

What version of B4A are you using. Your layout file is missing (.bal) from the project above

 

[Johan Schoeman]

This is the project.

Solved using team viewer......

 

[Ricardo Escalante]

Thank you very much the project is already working.
I think I have ventured into this environment without having the necessary knowledge, I am learning on the go.

I can not thank you enough.

 

[matek]

Hello
I have a question about the lib
What could be the cause of such a chart?

 

[beaker]

Hello
I have a question about the lib
What could be the cause of such a chart?

I think this is probably due to the 'CubicIntensity' value for the line. Try a smaller value and see whether that improves things.

 

[matek]

thank you very much, it helped

 

[wimpie3]

I'm using the CombinedChart and it seems that:

1. the YaxisLeftMinVal and/or YaxisrightMinVal are not used if the value is > 0. I'm using "100" as the value, but the bar charts seem to start always at minimal position 0...

2. individual bars cannot have a different color?

3. only one line chart can be added to a CombinedChart?

Furthermore, in general: null values are not supported? This means that EVERY X-point needs a value in the line graph? :-(

 

[Johan Schoeman]

@wimpie3, I have made so many changes to the original code of the MPAndroidChart project (based on request) that it will be no simple task to add additional features to it based on recent updates of the original code. I have added features to the original code that was not there in the first place - so it is just not a case of plugging in a revised class. Most of the original classes have been modified extensively. If you want to do the changes/amendments I am more than happy to post the library code as it is at present and you can then add the changes to it. Would you like me to post the Java code?

 

[matek]

Hello
I have a question
Is it possible to display values X and Y in the position as indicated in the attachment

 

[Johan Schoeman]

I'm using the CombinedChart and it seems that:

1. the YaxisLeftMinVal and/or YaxisrightMinVal are not used if the value is > 0. I'm using "100" as the value, but the bar charts seem to start always at minimal position 0...

2. individual bars cannot have a different color?

3. only one line chart can be added to a CombinedChart?

Furthermore, in general: null values are not supported? This means that EVERY X-point needs a value in the line graph? :-(

The attached project takes care of two of the issues that you raised - assigning different colors to the bars and setting the Min/Max values being displayed on the Y-Axis (left and right).

It brings its own complexity to the party when changing the colors of the bars (as far as the legend is concerned). So what color do you want to be displayed as the bar color legend?

Your other request - the original Github code that I have wrapped does not support more than one line/bar per combined line/bar chart. If you want me to look into this then let me know and I will let you know the cost of changing the code.

This part of the mpAndroidChart project will expire on 29 September 2017.

 

[kevinl]

Really a great library Johan, thanks!

One question I have is the following:
How can I format the numbers on for example the Y-axis (specifically set the number of decimals to a fixed amount)? I know this is possible in the originally library but haven't found this option here yet.

Best regards,
Kevin