https://github.com/marverix/dashbi-widget-chart

Dashbi widget: Display chart using chartist.js
https://github.com/marverix/dashbi-widget-chart

Last synced: 2 months ago
JSON representation

Dashbi widget: Display chart using chartist.js

• Host: GitHub
• URL: https://github.com/marverix/dashbi-widget-chart
• Owner: marverix
• License: isc
• Archived: true
• Created: 2019-08-22T13:14:58.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2019-09-02T14:10:06.000Z (almost 6 years ago)
• Last Synced: 2024-08-03T15:06:13.141Z (11 months ago)
• Language: Vue
• Size: 6.84 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# dashbi-widget-chart

Dashbi widget that displays chart using [chartist.js](https://gionkunz.github.io/chartist-js/)

![screenshot](_screenshot.png)

## Usage

### Install

```sh

npm install --save dashbi-widget-chart

```

### Register

Dashbi should detect and auto-register widget.

### Configuration

Name | Type | Description

--- | --- | ---

`type` | String | Type of chart. Options: `Line`, `Bar`, `Chart`

`useStateKey` | String | Which state key should be used for data presentation

`options` | Object | Additional chartist.js options

### Example

Lets' say that `some-data-provider` provides state which has key `randomNumber`:

```js

dashbiLayout.addWidget({

  name: 'chart',

  title: 'My Line Chart',

  params: {

    type: 'Line',

    useStateKey: 'randomNumber',

    options: {

      low: 0,

      hight: 1000

    }

  },

  source: {

    name: 'some-data-provider'

  }

});

```