---
order: 4
group:
  title: 图表
  order: 1
---

## 基础仪表盘

```tsx
import React from 'react';
import * as Charts from 'edata-charts';
  const props ={
      size:{
        width:372,
        height:160
      }
  }
export default () => (
  <div
    style={{
      width: '100%',
      height: 200,
      padding: 10,
      background:'black'
    }}
  >
    <Charts.BasicGaugeChart {...props} />
  </div>
);
```

## API

| 参数          | 说明                 | 类型    |
| ------------- | -------------------- | ------- |
| size          | 容器的宽高           | object  |
| name          | 仪表名称             | string  |
| value         | 仪表数值             | number  |
| valueName     | 仪表数值名称         | string  |
| min           | 仪表表盘最小值       | number  |
| max           | 仪表表盘最大值       | number  |
| splitNumber   | 仪表盘刻度的分割段数 | number  |
| startAngle    | 表盘开始角度         | number  |
| endAngle      | 表盘结束角度         | number  |
| isShowPointer | 是否展示指针         | boolean |
|   BarColor1   | 轴线第一段颜色         | string |
|   BarColor2   | 轴线第二段颜色         | string |
|   BarColor3   | 轴线第三段颜色         | string |

### size

| 参数   | 说明 | 类型           |
| ------ | ---- | -------------- |
| width  | 宽度 | number\|string |
| height | 高度 | number\|string |
