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

Similar threads

B4A Tutorial Android Charts Framework
B4A Library [B4X] [XUI] Pie Chart
Share My Creation Google Charts
B4A Tutorial [B4X] Smart String Literal
B4A Tutorial Add Charts With Google Charts Service

Johan Schoeman

Expert
Licensed User
Hi Johan, first of all thanks for your job. But, in my app when i divide the x axis by day and when the number is zero, 0.0 is orrible. I prefer 0

No problem, currently my app is for me and not for the market.
OK - have changed the code. It will display 0 if the value is 0 only and will display x.x for any non-zero value. Use new lib files attached.

1.png
 

Attachments

Johan Schoeman

Expert
Licensed User
Hi Johan

Thanks for your great multilinechart lib.

Would I be able to set the x-axis and y-axis intervals. I have 100 points to plot and I want to set the intervals to 20 for x and y major grid lines. Is that possible?

Also, I am unclear on what the following does
- DesignerCreateView
- MaxVisibleValueCount

Thanks.
This is the best that the original code will allow one to do without doing surgery on the original code:

B4X:
mlc1.XaxisLabelsToSkip =  xxxx
mlc1.YaxisLeftLabelCount = xxxx
Read the help on the above two methods when you for eg type mlc1.(and then search for YaxisLeftLabelCount and XaxisLabelsToSkip in the dropdown list). Posting the new library files as well as a B4A project demonstrating these two methods. The methods are simple to use/figure out - just read the help and see the example project attached.


1.png


Some sample code:

B4X:
#Region  Project Attributes
    #ApplicationLabel: DT1111
    #VersionCode: 3
    #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 mlc1  As MultiLineChart

   
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")
   
    DrawGraph
   
End Sub

Sub Activity_Resume

End Sub

Sub Activity_Pause (UserClosed As Boolean)

End Sub

Sub DrawGraph

       
            mlc1.ChartDescription = "TITLE : Just some random data"   'SORTED OUT DISPLAY OF DESCRIPTION IF NO TITLE IS SET - 22 OCT 2015
            mlc1.ChartDescriptionColor = Colors.Red
            mlc1.ChartDescriptionTextSize = 15   
            mlc1.GridBackgroundColor = Colors.DarkGray
           
        '    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,

        '   CIRCLE, SQUARE, LINE

            mlc1.LegendShapeSize = 10.0
            mlc1.setTheLegendPositionAndForm("BELOW_CHART_CENTER","CIRCLE")
            mlc1.TheLegendColor = Colors.yellow
            mlc1.TheLegendTextSize = 10.0   
            mlc1.LegendText = Array As String("2011", "2012", "2013", "2014", "2015")


            mlc1.ValueTextColor = Array As Int(Colors.White, Colors.Red, Colors.White, Colors.Red, Colors.White)
            mlc1.ValueTextSize = Array As Float(12.0, 10.0, 14.0, 8.0, 16.0)

            mlc1.YaxisTextSize = 10.0
           
        '   We are going to draw 1 charts/graphs
       
            Dim cht1data(101) As Float
            For i = 0 To 100
                cht1data(i) = i * 2
            Next
            mlc1.Chart_1_Data = cht1data
           
           
'            mlc1.Chart_2_Data = Array As Float(1200.0, 750.0, 450.0, 960.0, 730.0, 1100.0, 676.5, 985.6, 1010.8, 836.4, 498.5, 965.3)   
'            mlc1.Chart_3_Data = Array As Float(-10.0, -30.0, -20.0, 50.0, -40.0, 30.0, -45.0, 15.0, -38.3, 18.9, -29.8, 15.7)   
'            mlc1.Chart_4_Data = Array As Float(345.0, -380.2, -250.4, 849.7, 445.0, 600.5, -300.0, 50.0, 550.0, 1100.0, 894.2, 993.8)   
'            mlc1.Chart_5_Data = Array As Float(40.0, 60.0, 50.0, -80.0, 70.0, -60, 75.0, -45.0, 68.3, -48.9, 59.8, -45.7)   
           
            Dim ad() As String = Array As String("LEFT", "LEFT", "LEFT", "LEFT", "LEFT")     'NEW - ADDED Y AXIS DEPENDANCY - 22 OCT 2015
            mlc1.YaxisDependancy = ad                                                           'NEW - ADDED Y AXIS DEPENDANCY - 22 OCT 2015

            mlc1.DrawGraphValues = Array As Boolean(False, True, True, True, False)   
           
        '   Maximum 5 colors to be passed ==> must be at least equal to the number of data sets that are passed i.e maximum 5
        '   If you pass only for eg 2 data sets then at least 2 colors need to be passed
        '   If more that 2 colors are passed with for eg only 2 data sets then only the first 2 colors will be used in the color array
            mlc1.LineColors = Array As Int(Colors.Yellow, Colors.Red, Colors.Blue, Colors.Green, Colors.Cyan)
            mlc1.GraphLineWidth = Array As Float(2.0, 3.0, 4.0, 5.0, 6.0)
            mlc1.DrawFilled = Array As Boolean(False, False, False, False, False)
           
            mlc1.XaxisTextColor = Colors.Green
            mlc1.XaxisTextSize = 12.0   
           
            Dim xal(101) As String
              For i = 0 To 100
                  xal(i) = i
            Next
            mlc1.XaxisLables = xal
           
        '  TOP, BOTTOM, BOTH_SIDED, TOP_INSIDE, BOTTOM_INSIDE
            mlc1.XaxisLabelPosition = "BOTTOM"
            mlc1.XaxisTextAngle = 0                           'NEW - 'AMENDED CODE TO SET THE ANGLE OF THE X AXIS LABELS BETWEEN -90 and 90 - 22 OCT 2015
            mlc1.VerticalGridColor = Colors.Green             'NEW  - ADDED ABILITY TO SET THIS COLOR - 22 OCT 2015

            mlc1.DrawXaxisGridLines = True

            mlc1.XaxisLabelsToSkip = 19                       'NEW - ADDED 5 NOV
           
            mlc1.DrawYaxisLeftGridLines = True                'NEW - ADDED 23 OCT 2015
            mlc1.DrawYaxisRightGridLines = False              'NEW - ADDED 23 OCT 2015
           
            mlc1.YaxisLeftMinVal = 0                          'UNCOMMENT ON 5 NOV 2015 TO SET THE MINIMUM OF THE Y AXIS - comment it out so that the scale will be set automatically
            mlc1.YaxisLeftMaxVal = 200                        'UNCOMMENT ON 5 NOV 2015 TO SET THE MAXIMUM OF THE Y AXIS - comment it out so that the scale will be set automatically

        '   mlc1.YaxisRightMinVal = -175                      'AMENDED 22 OCT 2015 TO SET RIGHT Y AXIS MIN VAL INDEPENDANTLY - comment it out so that the scale will be set automatically
        '    mlc1.YaxisRightMaxVal = 175                       'AMENDED 22 OCT 2015 TO SET RIGHT Y AXIS MAX VAL INDEPENDANTLY - comment it out so that the scale will be set automatically
           
            mlc1.YaxisTextSize = 10.0
           
            mlc1.YaxisLeftLabelCount = 10                     'NEW - ADDED 5 NOV 2015
'            mlc1.YaxisRightLabelCount = 10
           
            mlc1.YaxisLeftTextColor = Colors.Cyan              'NEW - ADDED 23 OCT 2015    
            mlc1.YaxisRightTextColor = Colors.Yellow          'NEW - ADDED 23 OCT 2015
           
            mlc1.ShowYaxisRightLabels = False
            mlc1.ShowYaxisLeftLabels = True
           
            mlc1.DrawLeftGridDashed = False                   'NEW - ADDED 23 OCT 2015
            mlc1.DrawRightGridDashed = True                   'NEW - ADDED 23 OCT 2015
           
            mlc1.YaxisTextAngle = 0                           'NEW - 'ADDED ABILITY TO SET THE ANGLE OF THE Y AXIS LABELS BETWEEN -90 and 90 - 22 OCT 2015
            mlc1.HorizontalGridColorLeft = Colors.Cyan        'NEW - 'ADDED ABILITY TO SET THIS COLOR - 22 OCT 2015
            mlc1.HorizontalGridColorRight = Colors.Yellow     'NEW - 'ADDED ABILITY TO SET THIS COLOR - 22 OCT 2015
           
            mlc1.CubicIntensity = Array As Float(0.1, 0.2, 0.3, 0.4, 0.5)
            mlc1.DrawCubicGraph = Array As Boolean(True, False, True, False, True)
            mlc1.DrawDashedLine = Array As Boolean(True, False, True, False, True)
            mlc1.GraphCircleSize = Array As Float(4.0, 5.0, 6.0, 7.0, 8.0)
            mlc1.GraphCircleColor = Array As Int(Colors.Red, Colors.Green, Colors.Magenta, Colors.Black, Colors.Blue)
            mlc1.DrawGraphHollowCircles = Array As Boolean(True, False, True, False, True)
            mlc1.MarkerToUse = 4
           
            mlc1.XAnimate = False
            mlc1.YAnimate = True
            mlc1.ChartAnimationTime = 2000                     'milliseconds
           
        '   the number of charts to be drawn (maximum 5, in this case 5)
        '   the number of x-axis values per chart (in this case 12 = number of elements in the array passed to mlc1.XaxisLables)
            mlc1.setLineData( 1,101 )                         '5 NOV 2015 - CHANGED THE VALUE TO 101 TO DRAW THE 101 DATA POINTS

               
   
End Sub
 

Attachments

DT1111

Member
Licensed User
Hi Johan

Thank you so much for your generous effort and time and the updated library is simply stellar!

Yes the graph does exactly what I have wanted.

Thanks!
 

Johan Schoeman

Expert
Licensed User
@Johan Schoeman:
When you updated the lib to the one in post #63, the Yaxis labels no longer show up except for the first and last point.
Sorry about it - fixed. Had a line commented in the wrapper while I was busy working on @DT1111 's requirements. Attached new lib files.

1.png
 

Attachments

Johan Schoeman

Expert
Licensed User

DT1111

Member
Licensed User
Hi Johan

Thanks for the suggestion but if my understanding and observation are correct, the XAnimate is purely an animation thing. It requires complete array of x-axis data and then stretches it like a spring when XAnimate'd. Pretty neat though.

Whereas what I have in mind (with respect to the oscilloscope) is when an x-axis data becomes available it get plotted on the graph. Using the y=mx example above, if x is incremented by one every second, the line extends across the the graph one point at a time (the x-axis range is fixed from 0 to 100 from the start). The line will be fully extended at the end of 100 seconds.

Is this possible?
 

Doug Harris

Member
Licensed User
Hello Johan -

After looking at several different charting packages available for B4A, yours appears to blow the others away. I have tried to run several of your examples, but get the same error. This error below is from the MPLineChart example and the error occurs each time the application tries to set the LineData property. Do you have any suggestions?

Error occurred on line: 91 (Main)
android.content.res.Resources$NotFoundException: Resource ID #0x0
at android.content.res.Resources.getValue(Resources.java:1883)
at android.content.res.Resources.loadXmlResourceParser(Resources.java:3028)
at android.content.res.Resources.getLayout(Resources.java:1722)
at android.view.LayoutInflater.inflate(LayoutInflater.java:395)
at android.view.LayoutInflater.inflate(LayoutInflater.java:353)
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:26)
at mpandroidchartwrapper.lineChartWrapper.setLineData(lineChartWrapper.java:257)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:511)
at anywheresoftware.b4a.shell.Shell.runVoidMethod(Shell.java:742)
at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:342)
at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:246)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:511)
at anywheresoftware.b4a.ShellBA.raiseEvent2(ShellBA.java:134)
at JHS.MPLineChart.main.afterFirstLayout(main.java:102)
at JHS.MPLineChart.main.access$000(main.java:17)
at JHS.MPLineChart.main$WaitForLayout.run(main.java:80)
at android.os.Handler.handleCallback(Handler.java:725)
at android.os.Handler.dispatchMessage(Handler.java:92)
at android.os.Looper.loop(Looper.java:175)
at android.app.ActivityThread.main(ActivityThread.java:5279)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:511)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1102)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:869)
at dalvik.system.NativeStart.main(Native Method)
 

Johan Schoeman

Expert
Licensed User
Hello Johan -

After looking at several different charting packages available for B4A, yours appears to blow the others away. I have tried to run several of your examples, but get the same error. This error below is from the MPLineChart example and the error occurs each time the application tries to set the LineData property. Do you have any suggestions?

Error occurred on line: 91 (Main)
android.content.res.Resources$NotFoundException: Resource ID #0x0
at android.content.res.Resources.getValue(Resources.java:1883)
at android.content.res.Resources.loadXmlResourceParser(Resources.java:3028)
at android.content.res.Resources.getLayout(Resources.java:1722)
at android.view.LayoutInflater.inflate(LayoutInflater.java:395)
at android.view.LayoutInflater.inflate(LayoutInflater.java:353)
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:26)
at mpandroidchartwrapper.lineChartWrapper.setLineData(lineChartWrapper.java:257)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:511)
at anywheresoftware.b4a.shell.Shell.runVoidMethod(Shell.java:742)
at anywheresoftware.b4a.shell.Shell.raiseEventImpl(Shell.java:342)
at anywheresoftware.b4a.shell.Shell.raiseEvent(Shell.java:246)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:511)
at anywheresoftware.b4a.ShellBA.raiseEvent2(ShellBA.java:134)
at JHS.MPLineChart.main.afterFirstLayout(main.java:102)
at JHS.MPLineChart.main.access$000(main.java:17)
at JHS.MPLineChart.main$WaitForLayout.run(main.java:80)
at android.os.Handler.handleCallback(Handler.java:725)
at android.os.Handler.dispatchMessage(Handler.java:92)
at android.os.Looper.loop(Looper.java:175)
at android.app.ActivityThread.main(ActivityThread.java:5279)
at java.lang.reflect.Method.invokeNative(Native Method)
at java.lang.reflect.Method.invoke(Method.java:511)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1102)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:869)
at dalvik.system.NativeStart.main(Native Method)
Doug, read post #12 of this thread. Do you have the files in your Object/res folder and are they set to READ ONLY? I think your project is looking for/can't find the png and xml files for the marker
 
Last edited:

Paulsche

Well-Known Member
Licensed User
Hi Johan,

You can post a little guide,
everything that is necessary during installation?
I do not get a demo to run, have the library files
copied into the Libraries folder, but apparently is not enough that.
 

Attachments

Johan Schoeman

Expert
Licensed User
Hi Johan,

You can post a little guide,
everything that is necessary during installation?
I do not get a demo to run, have the library files
copied into the Libraries folder, but apparently is not enough that.
Not sure why you are stuck and with which one of the demo's. It seems you are stuck with the Pie Chart in post #1 of this thread? Just to make sure:

1. Have you copied the library files to your B4A additional library folder?
2. Have you selected/ticked the library in the library list of your B4A project? I think it is called mpChartLib
 

Paulsche

Well-Known Member
Licensed User
Hi Johan,

You can post a little guide,
everything that is necessary during installation?
I do not get a demo to run, have the library files
copied into the Libraries folder, but apparently is not enough that.
My problem was that I have taken the latest library files with the demo by post 1
The demos in Post 3 works with the Librarie of post 3.
 

Paulsche

Well-Known Member
Licensed User
Hi Johan,

you can take the X-axis as a date?
I want data as of 1.1.15 - 1.6.15 display.
With date as a string label that goes, but the date will be evenly divided between the X-axis and not as a timeline.

Thanks for the Librarie, I'm just the exchange of charts against your great Librarie.
 

Paulsche

Well-Known Member
Licensed User
Hi Johan,

another Problem:
I have a multiline chart with two series,
the second series (temperature) has fewer points,
there is not always a temperature was entered.
This now generates an error when:
multiLineChart1.setLineData (2, dat_list.Size)
Is there a solution?
 

tpakis

Active Member
Licensed User
This library is awesome!!
I was wondering is there any way we can find the points where the line "cuts" the x axis? (the y is relatively easy by calculating the point with x=0)
 
Top