line-charts-react

A simple React js component to create various line charts

Version 1.0.0 released! YAY!

To get it running you need to pass at least those two props:

| Prop | Type | |----------------|-------------------------------| |sets |Array of arrays of real numbers| |times |Array of arrays of timestamps |

IMPORTANT You will need to use the bootstrap CSS to make it look pretty so include this (with the appropriate version) in your HTML file:

<link crossorigin="anonymous" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
      integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" rel="stylesheet">

Example:

<div className="card">
    <div className="card-body">
        <LineChart
            sets={[
                [1444, 350, 200],
                [1320, 1000, 400]
            ]}
            times={[
                ["2019-08-12T00:44:20.963Z", "2019-08-13T00:44:20.963Z",
                    "2019-08-14T00:44:20.963Z"].map((e) => new Date(e)),
                ["2019-08-11T00:44:20.963Z", "2019-08-12T00:44:20.963Z",
                    "2019-08-13T00:44:20.963Z"].map((e) => new Date(e)),
            ]}
        />
    </div>
</div>

Note that for every element of the set there must be a corresponding timestamp.

More details will be coming soon (when I get more free time :))