# fc-chart

An element by Forter
<!-- Author: Omer Anati <omer.anati@forter.com> -->

## Usage

```html
<script>
   import '@forter/chart';
</script>

<fc-chart
  config={"xAxisType":"SINGLE_TIME_FIELD","series":[{"seriesType":"LINE","label":"AGGS.APPROVED.LABEL","aggregation":{"key":"APPROVED","filters":{},"dimensions":[{"key":"TRANS_TIME","label":"DIMENSION.TRANS_TIME.LABEL"}],"data":[{"dimensions":["2021/07/02"],"value":10,"formattedValue":10,"aggregationLabel":"Approved Tx"},{"dimensions":["2021/07/05"],"value":11,"formattedValue":11,"aggregationLabel":"Approved Tx"},{"dimensions":["2021/07/11"],"value":10,"formattedValue":10,"aggregationLabel":"Approved Tx"},{"dimensions":["2021/07/18"],"value":12,"formattedValue":12,"aggregationLabel":"Approved Tx"}]}}]}
>
</fc-chart>
```

## Properties

| Property                         | Attribute                        | Type      | Default |
|----------------------------------|----------------------------------|-----------|---------|
| `config`                         | `config`                         | `{}`      | {}      |
| `configHash`                     | `configHash`                     | `string`  |         |
| `currentBuilder`                 |                                  | `any`     |         |
| `disabled`                       | `disabled`                       | `boolean` | false   |
| `isLegendBoxOpen`                | `isLegendBoxOpen`                | `boolean` | true    |
| `isLegendExpandIndicatorVisible` | `isLegendExpandIndicatorVisible` | `boolean` | true    |
| `isLegendHidden`                 | `isLegendHidden`                 | `boolean` | false   |
| `loading`                        | `loading`                        | `boolean` | false   |
| `previewMode`                    | `preview-mode`                   | `boolean` | false   |
| `type`                           | `type`                           | `string`  | "line"  |

## CSS Custom Properties

| Property                    | Description                     |
|-----------------------------|---------------------------------|
| `--fc-chart-disabled-color` | disabled color. example: `gray` |