@clunch/line

line

📈 折线图组件，包括折线和曲线、单条、多条、背景、渐变等常见的折线图。

如何使用？

首先，需要安装npm包（目前我们仅支持npm方式管理）：

npm install --save clunch @clunch/line

然后注册组件：

import Clunch from 'clunch';
import line from '@clunch/line';

Clunch.series('ui-line',line);

然后，你就可以使用这个组件了：

<ui-line data='Array' ruler='Array<String>'/>

• data:数据，应该是一个数组（比如：[[19,22,32],[1,22,3],[1,2,63],...]或[51,23,3,...]）
• ruler:刻度尺显示的内容（比如：["一月","二月","三月",...]）

除了上面的必输项外，还有下列可选项：

属性	类型	描述	默认值	可选值
x	number	图形左上角位置横坐标	0
y	number	图形左上角位置纵坐标	0
width	number	图形宽	画布的宽
height	number	图形高	画布的高
colors	Array<string>	线条的颜色	内置循环色
max-value	number	最大值	动态计算得出
min-value	number	最小值	动态计算得出

由于此组件是基于Clunch开发的，我们默认你已经掌握了相关知识。

<< 你可以点击此次学习Clunch.js如何使用

联系我们

• QQ: 2501482523
• Email: [e-mail]

开源协议

MIT

Copyright (c) 2021 hai2007 走一步，再走一步。