https://github.com/mrxujiang/ticker

一个基于react的轻量级刻度线可视化组件
https://github.com/mrxujiang/ticker

component graph react ticker visual

Last synced: 2 months ago
JSON representation

一个基于react的轻量级刻度线可视化组件

• Host: GitHub
• URL: https://github.com/mrxujiang/ticker
• Owner: MrXujiang
• License: mit
• Created: 2020-06-01T06:42:11.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2020-06-01T10:35:20.000Z (over 4 years ago)
• Last Synced: 2024-04-14T00:31:49.340Z (8 months ago)
• Topics: component, graph, react, ticker, visual
• Language: TypeScript
• Size: 179 KB
• Stars: 9
• Watchers: 3
• Forks: 8
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# @umi-material/ticker

一个基于react的轻量级刻度线可视化组件

## 组件截图



## Usage

```sh

umi block https://github.com/https://github.com/MrXujiang/ticker/tree/master/ticker

```

## 启动

```

npm run dev or yarn dev

```

## demo

``` js

```

## api文档

| 属性名 | 类型 | 默认值 | 解释 |

|  ----  | ----  | ---- | ---- |

| width | number | 100 |  刻度组件的宽度   |

| maxHeight | number | 10 |  刻度线的最大高度   |

| percent | number | 50 |  当前刻度条的进度,值在0~100之间   |

| text | string | '' |  刻度条组件的文本   |

| value | number | 50 |  刻度组件的当前值   |

| showValue | boolean | true |  是否展示刻度线值  |

| unit | string | '' |  刻度线值的单位   |

| lineNum |number | 12 |  刻度条的数量   |

| defaultColor | string | '#06c' |  刻度线默认颜色   |

| activeColor | string | 'red' |  刻度线激活部分的颜色  |

| textStyle | object | {} |  刻度线文本样式   |

| valueStyle | object | {} |  刻度条值的样式   |

## 技术交流



## LICENSE

MIT