fineui是帆软报表和BI产品线所使用的前端框架。
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
|
|
# bi.canvas
|
|
|
|
|
|
|
|
|
|
## canvas绘图,基类[BI.Widget](/core/widget.md)
|
|
|
|
|
|
|
|
|
|
{% method %}
|
|
|
|
|
[source](https://jsfiddle.net/fineui/gcgd1va0/)
|
|
|
|
|
|
|
|
|
|
{% common %}
|
|
|
|
|
```javascript
|
|
|
|
|
|
|
|
|
|
var canvas = BI.createWidget({
|
|
|
|
|
type: "bi.canvas",
|
|
|
|
|
element: "#wrapper",
|
|
|
|
|
width: 500,
|
|
|
|
|
height: 600
|
|
|
|
|
});
|
|
|
|
|
canvas.circle(150, 50, 20, "green");
|
|
|
|
|
canvas.stroke();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
{% endmethod %}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## 对外方法
|
|
|
|
|
| 名称 | 说明 | 回调参数
|
|
|
|
|
| :------ |:------------- | :-----
|
|
|
|
|
| line | 绘制线段| (x0, y0, x1, y1) |
|
|
|
|
|
| rect | 绘制矩形 | (x,y,w,h,color)分别表示左上角的横坐标、纵坐标，矩形宽、高、以及绘制的颜色|
|
|
|
|
|
| circle | 绘制圆形 | (x, y, radius, color)分别表示原点的横坐标，纵坐标，半径以及颜色 |
|
|
|
|
|
| hollow | 填充中空的路径 | |
|
|
|
|
|
| solid | 填充实心的路径 | |
|
|
|
|
|
| gradient | 绘制渐变色 | (x0, y0, x1, y1, start, end) |
|
|
|
|
|
| reset | 重置画布 | —|
|
|
|
|
|
| stroke | 绘制 | callback |
|
|
|
|
|
|
|
|
|
|
---
|
|
|
|
|
|
|
|
|
|
|
