Browse Source

init docs

pull/2/head
vargburz 2 years ago
parent
commit
c3e5ea0ef6
  1. 47
      README.md

47
README.md

@ -3,18 +3,51 @@
# Chartwerk Core # Chartwerk Core
Repo contains the core code of chartwerk project: abstrac classes and rendreing of grid together with crosshair! :) Repo contains the core code of chartwerk project: abstract classes, rendering system, basic components.
See ChartwerkPod to see what is parent for all chartwerk pods and get involved into development. See ChartwerkPod to see what is parent for all chartwerk pods and get involved into development.
Everything can be overwritted.
## Plugin renders:
- SVG container with: ## Plugin contains:
- SVG container.
- Series and Options models with defaults.
- State model to control charts changes.
- Overlay container to handle all events.
- Zoom events controller.
- Axes, with ticks and labels. - Axes, with ticks and labels.
- Grid, which scales using specified time interval. - Grid, with separate behavior from axis.
- Legend, which can hide metrics. - Legend, which can hide metrics.
- Crosshair.
## Declare
```js
const pod = new ChartwerkPod(
document.getElementById('chart-div'),
series,
options,
);
pod.render();
```
## Series
Series is a list of metrics with datapoints and specific config working for each serie.
series = Serie[]
- `datapoints` - metric data for rendering.
```js
datapoints = [number, number][]; // 0 index for X, 1 index for Y
```
- `target` - id of metric. Required param, should be unique.
```js
target: string;
```
## Options: ## Options:
Options are not mandatory: Options is a config working for whole chart and metrics.
All options are optional.
- `margin` — chart container positioning; - `margin` — chart container positioning;
```js ```js
@ -22,7 +55,7 @@ margin={
top: number, top: number,
right: number, right: number,
bottom: number, bottom: number,
left: number left: number,
} }
``` ```

Loading…
Cancel
Save