B4A Library GraphView Library

Discussion in 'Additional libraries, classes and official updates' started by walterf25, Nov 26, 2013.

  1. walterf25

    walterf25 Well-Known Member Licensed User

    The so much awaited time is here, I have finally Updated the GraphView Library, there are some majors updates as the main jar file has been upgraded by the original author of this library.
    This library is now complete, all methods and functions have been wrapped, although i have not fully tested it myself. I'am providing a small example to show some of the new features this library offers.

    Note:
    This library requires the AppCompat library done by Corwin42, thanks to him for this great library and it can be downloaded from here
    AppCompat


    Line Series
    BarGraph Series
    Points Series

    • With this new version you can use as many series as you wish (have not tested with more than 5 series)
    • The option to use Dates in the X axis is now also available.
    • This library allows you to have 2 Y Axis, it also includes a click listener for any Series you provide, you can click on any data point on the series and either show a toast message or log the data.
    • Custom Label Formatter
    • Change all Axis Text color and Text size
    • Change Graph's Title color and Text size
    • Live Graph
    • Change Points series to Circular, Square and Triangle
    • Display Data Point values on top of Bar graph series
    • Change the legend's physical position (Top, Middle, Bottom)
    • Many other options.......
    B4AGraphView
    Version:
    1.35
    • LineSeries
      Events:
      • SeriesClicked (xdata as String As , ydata as String As )
      Methods:
      • AppendData (x As Double, y As Double, viewportsize As Int)
        Appends data to an already existing series, used to plot live Data, and sets the viewport size
        Example
        <code>
        series.AppendData(x, y, 100)
        </code>
      • DataPointRadius (series As LineGraphSeries, size As Int)
        Sets the line series data Point radius
        Example
        <code>
        series.DataPointRadius(series, 10)
        </code>
      • DrawBackGroundColor (color As Int)
        Sets the line series background color / the background color for the filling under the line.
        Example
        <code>
        series.DrawBackGroundColor(colors.LightGray)
        </code>
      • Initialize (eventName As String, title As String, color As Int, Dates As Boolean, xdata() As Double, ydata() As Double) As LineGraphSeries
      • IsInitialized As Boolean
      • ResetData (x() As Double, y() As Double) As DataPoint[]
        Resets the x, and y axis data
        <B>NOTE: Use only in Sub Activity_Resume
        before appending any data to a series.</B>
        Example
        <code>
        series.ResetData(xx, yy)
        </code>
      • ShowDotDataPoints
        Enables the DataPoints to be shown on the Line Series
        Example
        <code>
        series.ShowDotDataPoints
        </code>
      • ShowDottedLine (linecolor As Int, strokewidth As Int)
        Changes the Line Series to a dotted line, sets the color and the stroke width
        Example
        <code>
        series.ShowDottedLine(colors.Black, 15)
        </code>
    • PointGraphSeries
      Events:
      • SeriesClicked (xdata as String As , ydata as String As )
      Methods:
      • Initialize (eventName As String, title As String, color As Int, Dates As Boolean, xdata() As Double, ydata() As Double) As PointsGraphSeries
      • IsInitialized As Boolean
      • SetPointShape
        Changes the Points Shape to round shape
        Example
        <code>
        dim pointseries as PointGraphSeries
        pointseries.Initialize("pointseries", "Points Series", colors.Blue, False, xx, yy)
        pointseries.SetPointShape
        </code>
      • SetRectangleShape
        Changes the points Shape to Rectangle shape
        Example
        <code>
        dim pointseries as PointGraphSeries
        pointseries.Initialize("pointseries", "Points Series", colors.Blue, False, xx, yy)
        pointseries.SetrectangleShape
        </code>
      • SetTriangleShape
        Changes the points Shape to Triangle Shape
        Example
        <code>
        dim pointseries as PointGraphSeries
        pointseries.Initialize("pointseries", "Points Series", colors.Blue, False, xx, yy)
        pointseries.SetTriangleShape
        </code>
    • bargraphseries
      Events:
      • SeriesClicked (xdata as String As , ydata as String As )
      Methods:
      • BarSeriesSpacing (series As BarGraphSeries, spacing As Int)
        Sets the Bar Series spacing
        Example
        <code>
        dim barseries as bargraphseries
        barseries.Initialize("barseries", "Bar Series", colors.Blue, False, xx, yy)
        barseries.BarSeriesSpacing(50)
        </code>
      • Initialize (eventName As String, title As String, color As Int, Dates As Boolean, xdata() As Double, ydata() As Double) As BarGraphSeries
      • IsInitialized As Boolean
      • showBarValues (series As BarGraphSeries, color As Int)
        Enables the Y axis values on top of the Bar series and sets the text color
        Example
        <code>
        dim barseries as bargraphseries
        barseries.Initialize("barseries", "Bar Series", colors.Blue, False, xx, yy)
        barseries.showBarValues(barseries, colors.Green)
        </code>
    • graph
      Methods:
      • AddBarSeries (Dates As Boolean, SecondScale As Boolean, series() As Bargraphseries) As GraphView
        Adds BarSeries to the graphview, it takes a boolean if using dates, a boolean if assigning the series to the second Y scale
        Example
        <code>
        dim barseries as bargraphseries
        dim xx(10) as double
        dim yy(10) as double
        for i = 0 to xx.lenght -1
        xx(i) = i
        yy(i) = i
        next
        barseries.Initialize("barseries", "Glucose Levels", Colors.Green, False, xx, yy)
        graphview.AddBarseries(False, False, Array as bargraphseries(barseries))
        </code>
      • AddLineSeries (Dates As Boolean, SecondScale As Boolean, series() As Lineseries) As GraphView
        Adds series lines to the graphview, it takes a boolean if using dates, a boolean if assigning the series to the second Y scale
        Example
        <code>
        dim series as lineseries
        dim xx(10) as double
        dim yy(10) as double
        for i = 0 to xx.lenght -1
        xx(i) = i
        yy(i) = i
        next
        series.Initialize("series", "Glucose Levels", Colors.Blue, False, xx, yy)
        graphview.AddLineSeries(False, False, Array as lineseries(series))
        </code>
      • AddPointsSeries (Dates As Boolean, SecondScale As Boolean, series() As Pointgraphseries) As GraphView
        Adds PointSeries to the graphview, it takes a boolean if using dates, a boolean if assigning the series to the second Y scale
        Example
        <code>
        dim pointseries as pointseries
        dim xx(10) as double
        dim yy(10) as double
        for i = 0 to xx.lenght -1
        xx(i) = i
        yy(i) = i
        next
        pointseries.Initialize("pointseries", "Glucose Levels", Colors.Red, False, xx, yy)
        graphview.AddPointSeries(False, False, Array as pointgraphseries(pointseries))
        </code>
      • FormatLabels (FractionDigits As Int, IntegerDigits As Int)
        Format horizontal and vertical labels
        Set number of fraction digits
        Set number of Integer digits
        Example
        <code
        >graphview.FormatLabels(2, 3)
        </code>
      • HorizontalLabelColor (color As Int)
        Sets the Horizontal scale label's text color
        Example
        <code>
        graphview.HorizontalLabelColor(colors.Blue)
        </code>
      • Initialize (title As String, Dates as Boolean) As GraphView
      • IsInitialized As Boolean
      • SetBackGroundColor (color As Int)
        Sets the grids background color
        <B>NOTE: There is an issue using this function when using two Y axis
        Only use it if one Y Axis is being used.</B>
        Example
        <code>
        graphview.SetBackGroundColor(colors.LightGray)
        </code>
      • SetCustomLabel (sign As String)
        Set custom labels on graphview
        Example
        <code>
        graphview.SetCustomLabel("$")
        </code>
      • SetGraphTitleColor (color As Int)
        Sets the Graph's Title color
        Example
        <code>
        graphview.SetGraphTitleColor(colors.Blue)
        </code>
      • SetGraphTitleSize (size As Int)
        Sets the Graph's Title size
        Example
        <code>
        graphview.SetGraphTitleSize(50)
        </code>
      • SetGraphViewTextSize (size As Float)
        Sets the Horizontal, Vertical and Second Vertical Text size
        Example
        <code>
        graphview.SetGraphViewTextSize(45)
        </code>
      • SetGridStyletoBoth
        Sets the graph's grid style to both Horizontal and Vertical
        Example
        <code>
        graphview.SetGridStyletoBoth
        </code>
      • SetGridStyletoHorizontal
        Sets the graph's grid style to Horizontal only (only Horizontal line)
        Example
        <code>
        graphview.SetGridStyltoHorizontal
        </code>
      • SetGridStyletoNone
        Sets the graph's grid style to None (No horizontal or vertical lines)
        Example
        <code>
        graphview.SetGridStyletoNone
        </code>
      • SetGridStyletoVertical
        Sets the graph's grid style to Vertical only (only Vertical Line)
        Example
        <code>
        graphview.SetGridStyletoVertical
        </code>
      • SetHorizontalAxisTitle (title As String, color As Int)
        Sets the Horizontal Axis Title and Color
        Example
        <code>
        graphview.SetHorizontalAxisTitle("Time(s)", colors.Blue)
        </code>
      • SetLegendAlignBottom
        Sets the graph's Legend physical Position to the bottom
        Example
        <code>
        graphview.SetLegendAlignBottom
        </code>
      • SetLegendAlignMiddle
        Sets the graph's Legend physical Position to the middle
        Example
        <code>
        graphview.SetLegendAlighMiddle
        </code>
      • SetLegendAlignTop
        Sets the graph's Legend physical position to the top
        Example
        <code>
        graphview.SetLegendAlignTop
        </code>
      • SetLegendBackGroundColor (color As Int)
        Sets the Legend's background color
        Example
        <code>
        graphview.SetLegendBackGroundColor(colors.LightGray)
        </code>
      • SetLegendMargin (margin As Int)
        Sets the Legend's margin / margin from the edge of the box to the corner of the graphview
        Example
        <code>
        graphview.SetLegendMargin(10)
        </code>
      • SetLegendPadding (padding As Int)
        Sets the Legend's padding / padding is the space between the edge of the box and the beginning of the text
        Example
        <code>
        graphview.SetLegendPadding(20)
        </code>
      • SetLegendSpacing (spacing As Int)
        Sets the Legend's spacing / set the spacing between the text lines
        Example
        <code>
        graphview.SetLegendSpacing(5)
        </code>
      • SetLegendTextColor (color As Int)
        Sets the text color of the legend labels.
        Example
        <code>
        graphview.SetLegendTextColor(colors.LightGray)
        </code>
      • SetLegendTextSize (textSize As Float)
        Sets the graph's Legend's Text Size
        Example
        <code>
        graphview.SetLegendTextszie(40)
        </code>
      • SetLegendWidth (width As Int)
        Sets the graph's Legend Width
        Example
        <code>
        graphview.SetLegendWidth(100)
        </code>
      • SetSecondYScaleColor (color As Int)
        Sets the Second Y Scale label's color
        Example
        <code>
        graphview.SetSecondYScaleColor(colors.Brown)
        </code>
      • SetVerticalAxisTitle (title As String, color As Int)
        Sets the Veritcal's Axis Title and Color
        Example
        <code>
        graphview.SetVerticalAxisTitle("Force(lbs)", colors.Red)
        </code>
      • VerticalLabelColor (color As Int)
        Sets the Vertical scale label's text color
        Example
        <code>
        graphview.VerticalLabelColor(colors.Magenta")
        </code>


    Hope you guys find this useful, compared to other methods found here in the forum i find this way easier to use, as it only requires a few lines of code.
    Please feel free to post your comments, recommendations and feedback.

    The Example i've put together can be downloaded from here:

    GraphView Example

    :Updated April 3rd, 2015

    Complete library based on the new original jar file.
     

    Attached Files:

    Last edited: Jul 16, 2015
  2. walterf25

    walterf25 Well-Known Member Licensed User

    I have updated the library to 1.35, please see the first post.

    Thanks,
    Walter
     
    Last edited: Apr 4, 2015
    ellpopeb4a likes this.
  3. wimpie3

    wimpie3 Active Member Licensed User

    The GraphView library has been wrapped before by XverHelstX, but not all functions were accessible and he ultimately gave up due to his studies. I'm glad to see that you're taking this up, but unfortunately, some of the functions (like changing the font, disabling the legend) are still missing. I really hope you'll continue with this project so that we'll finally end up with a completely wrapped GraphView... lots of people are waiting for this!
     
  4. walterf25

    walterf25 Well-Known Member Licensed User

    Hi wimpie3, i know XverHelstX has wrapped this library, however if you want to get it from him you have to pay, at first i wasn't thinking of releasing this library because i didn't have time to continue, i started wrapping it because i needed it for a project i'm working on at my job, but seeing how awesome this library is i thought maybe other people could benefit from it, it is way easier to use with only a few lines of code.
    I will try to work on the rest of the features later on, i will post an update when is ready.

    Cheers,
    Walter
     
  5. billzhan

    billzhan Active Member Licensed User

    Works great
     
    walterf25 likes this.
  6. walterf25

    walterf25 Well-Known Member Licensed User

    Hello Everyone I have decided to re-write the entire library, i have added most of the useful methods, such as turning on and off the legends, setting the vertical and horizontal label's colors, and the text size, please leave your comments or feedback, refer to the first post for the updated library and a new example.

    thanks,
    Walter
     
  7. billzhan

    billzhan Active Member Licensed User

    Hi Walter

    The new one works as expected, and the sample is more clear.
    Hope we have the multipleseries(>2) function in next update.

    Bill
     
  8. walterf25

    walterf25 Well-Known Member Licensed User

    billzhan, i'm glad you liked the graphview library, at the moment i have no plans to keep working on this library, i have one too many other projects that i need to take care of, but if you are willing to keep working with it i can give you the source code, obviously please post any updates on this thread.

    Cheers,
    Walter
     
  9. billzhan

    billzhan Active Member Licensed User

    Hi Walter

    I have not learned how to wrap libs,tried but failed. I'll let you know if I can work it. I am striving to complete my first app.
    Thanks for your great work.

    Bill
     
  10. wimpie3

    wimpie3 Active Member Licensed User

    Thanks for the new version. Getting close to usability now. Only three things are missing for me to finish my app: setCustomLabelFormatter (to be able to use strings in the x & y labels), drawBackground (to add a color underneath the curves) and setDrawDataPoints (to indicate the data points with a bullet). I know you don't have much time, but since this is the ONLY decent charts library currently available for B4A, we are all looking into your direction... A BIG THANKS!
     
    Last edited: Dec 12, 2013
  11. Paulsche

    Paulsche Well-Known Member Licensed User

    Hello,

    I also thank you for this library,
    I'll test it with my APPs.

    It would be great if the library is further improved
     
  12. Marcob

    Marcob Member Licensed User

    Hello, I agree with wimpie3, it would be useful to have the following methods exposed:

    - setCustomLabelFormatter
    - drawBackground
    - setDrawDataPoints


    Besides that I think it would be great to have a method for reading the actual values of the viewport, I mean a sort of getViewPort().
    Thanks for your valuable work.
     
    Manasia likes this.
  13. Mrjoey

    Mrjoey Active Member Licensed User

    Hey walter i tested ur library : im creating a music app that displays waveforms of the track , i tried using the standard canvas , succeeded but didint make the zoom and scrolling functions although i need some help to do that so i tried ur library and opened the example , i looked around the "simplegraph" module and i changed Dim y(100) As Double to Dim y(1000) As Double and loaded it , it was very slow when zooming and dragging although i tested it in my app and still slow , so i think its more useful for small graph , so i quit and im trying now the opengl and succeded but still need zooming and dragging so i liked to share my experience with ur library wish is awsome but not for my needs , best regards , joe.
     
  14. Michael Gasperi

    Michael Gasperi Member Licensed User

    Is there any way to fix the vertical axis values? It looks like they autoscale to whatever data is on the plot.
     
  15. walterf25

    walterf25 Well-Known Member Licensed User

    I'm not sure, i will have to check, i'll do it as soon as i have a chance.

    Thanks,
    Walter
     
  16. Michael Gasperi

    Michael Gasperi Member Licensed User

    Seems like the answer is no.
     
  17. walterf25

    walterf25 Well-Known Member Licensed User

    Sorry but i'm very busy with other projects at the moment, i don't have time to look into this right now.
     
  18. JoanRPM

    JoanRPM Active Member Licensed User

    It is possible, in the future, to plot more than 2 lines?
    In the original project seems to be 3.
    In a future project, I'll need 3.

    Thanks for sharing.
     
  19. walterf25

    walterf25 Well-Known Member Licensed User

    Yes i already have that version, give me some time to upload it, i may not have time today, but i will upload that version soon.

    thanks.
     
  20. JoanRPM

    JoanRPM Active Member Licensed User

    Wow.
    Wonderful library.

    Thanks.
     
Loading...
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice