trugraph

    3.0.1 • Public • Published

    TruGraph

    Getting Started

    Image of a graph generated by TruGraph

    To use TruGraph in your project, first import the modules into your project using:

    import TruGraph from 'trugraph'
    

    Basic Usage

    To add a graph to your page call TruGraph as follows:

    let graph = new TruGraph(id, data, layout)
    
    • REQUIRED: id is the id of the container element you wish to append your graph to.
    • REQUIRED: data is an object (or array of objects) containing the information about the expressions you wish to graph, such as the mathematical function, color, stroke, arrowheads, etc.
    • OPTIONAL: layout is an object used to set the properties of the graph, such as the axes, legends, etc.

    Data Object Properties

    Property Type Options Default
    expression string see math-expressions package x^2
    colour string hex, rgb, or rgba color scheme #FF0000
    thickness integer any integer value 2
    style string solid solid
    domain array Must contain 2 values. Any number or the string values 'negative infinity' and 'infinity' ['negative infinity', 'infinity']
    range array Must contain 2 values. Any number or the string values 'negative infinity' and 'infinity' ['negative infinity', 'infinity']
    endpoints Boolean true or false true
    endpointLeft string 'arrow', 'open-circle', 'closed-circle' 'arrow'
    endpointRight string 'arrow', 'open-circle', 'closed-circle' 'arrow'

    Layout Object Properties

    Property Type Options Default
    visibleDomain array Must contain 2 values. Any number or the string values 'negative infinity' and 'infinity' [-10,10]
    visibleRange array Must contain 2 values. Any number or the string values 'negative infinity' and 'infinity' [-10,10]
    dependentVar string Set the variable to be labelled on the horizontal axis of the graph 'x'
    independentVar string Set the variable to be labelled on the vertical axis of the graph 'y'
    border boolean Set to true to show a border around the graph, false for no border true
    borderColour string hex, rgb, or rgba color scheme '#000000'
    borderWidth integer Value to set the thickness of the border 2
    square boolean When set to true the graph will always render in a square regardless of the container dimensions false
    x object See axis properties below
    y object See axis properties below
    graphTitle string Any string of characters 'This is the Title'

    Axis Properties

    Property Type Options Default
    gridLines boolean Set to true to show the axis gridlines on the graph, or false to remove them true
    gridstart number A reference value on the axis for gridlines to start from 0
    gridspace number A value for the spacing between gridlines 0.5
    tickStart number A reference value on the axis for axis ticks to start from 0
    tickSpace number A value for the spacing between gridlines 0.5

    Install

    npm i trugraph

    DownloadsWeekly Downloads

    15

    Version

    3.0.1

    License

    ISC

    Unpacked Size

    861 kB

    Total Files

    11

    Last publish

    Collaborators

    • ronald.w.business