https://github.com/inab/uptime-chart-oeb
Standalone widget to display the uptime of a tool at OpenEBench.
https://github.com/inab/uptime-chart-oeb
elixir-europe elixir-spain openebench
Last synced: over 1 year ago
JSON representation
Standalone widget to display the uptime of a tool at OpenEBench.
- Host: GitHub
- URL: https://github.com/inab/uptime-chart-oeb
- Owner: inab
- License: apache-2.0
- Created: 2017-10-24T16:17:56.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2023-10-10T10:32:00.000Z (over 2 years ago)
- Last Synced: 2025-01-06T07:25:32.211Z (over 1 year ago)
- Topics: elixir-europe, elixir-spain, openebench
- Language: JavaScript
- Homepage: https://inab.github.io/uptime-chart-OEB/
- Size: 2.78 MB
- Stars: 0
- Watchers: 8
- Forks: 1
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# OpenEBench software monitoring uptime Chart
This is a standalone widget to display the uptime of a tool at OpenEBench.
## Live Demo
Live demo available at : https://inab.github.io/uptime-chart-OEB/
## NPM Package
NPM Package `@inb/oeb-classification-table` published to: `https://www.npmjs.com/package/@inb/oeb-uptime-chart`.
## How to use
The component can be imported in two ways: As npm package (preferred), or via the build file from the git repository (see bottom).
### Use the npm Package (Recommended way)
- Install the npm package in your project
```bash
npm i @inb/oeb-uptime-chart
```
- Add JS cdn for d3 (`src`=`https://cdnjs.cloudflare.com/ajax/libs/d3/5.9.7/d3.min.js`)
- Add JS cdn for c3 (`src`=`https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.3/c3.min.js`)
- Add stylesheet for c3 (`href`=`https://cdnjs.cloudflare.com/ajax/libs/c3/0.7.3/c3.min.css`)
- Add a div with the class `opebuptime` and the appropriate attributes (see "Attributes" section for more details):
```html
```
- Import the `loadChart` function in your frontend component and call it:
```javascript
import {loadChart} from "@inb/oeb-uptime-chart"
loadChart()
```
### Clone from repository (Alternative way)
- Add JS cdn for D3
```html
```
- Add JS and CSS cdns for c3
```html
```
- Add a` div` with the class `opebuptime` and the appropriate attributes (see "Attributes" section for more details).
- Add the build file which you can download from `build/build.js` and tag it into your html.
```HTML
```
- You can then call the `loadChart()` function. The HTML file should look like [this
](https://github.com/inab/uptime-chart-OEB/blob/master/index.html)
## Attributes
Attributes can be set on the _
_ tag
- data-id : should be unique and start with a letter
- data-url : the ID of the tool from OEB
- data-title : chart title
- data-xaxis : boolean
- data-w : width of the chart
- data-h : height of the chart
- data-limit : amout of dates to be displayed (min : 5)