Fabric.js 中文文档
基于canvas画布的实用类Fabric.js的使用
4、Fabric.js 常用的方法&事件
Fabric.js 画布 defaultCursor 属性(1)
官网文档地址:http://fabricjs.com/docs/github
地址:https://github.com/fabricjs/fabric.js
Demo地址:http://fabricjs.com/demos/
NPM 地址:https://www.npmjs.com/package/fabric
中文文档:https://www.wenjiangs.com/docs/fabric-js
使用
通过CDN引入:
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/4.5.0/fabric.min.js"></script>
或者
npm install fabric
import fabric from 'fabric';
<template><div><canvas ref="canvas"></canvas></div>
</template><script>
import fabric from 'fabric';export default {mounted() {// 在组件挂载后,创建Canvas对象并将其绑定到canvas元素上this.canvas = new fabric.Canvas(this.$refs.canvas);// 创建矩形对象const rect = new fabric.Rect({left: 100,top: 100,width: 200,height: 100,fill: 'red'});// 将矩形添加到Canvas中this.canvas.add(rect);}
}
</script>