drawing-box

使用示例

在main.js中进行全局注册使用づ♡ど

import App from './App.vue'

import Drawing from 'drawing-box'
Vue.use(Drawing)

在要使用的地方引入组件，放入页面中即可

<template>
  <div class="app">
    <drawing></drawing>
  </div>
</template>

组件参数

参数	类型	必选	拓展
canvasStyle	string	false	添加画布的自定义类名，默认值空
canvasWidth	number	false	自定义画布的宽度，默认为所在父容器的宽度
canvasHeight	number	false	自定义画布的高度，默认为所在父容器的高度
menubarConfig	Array	false	画布上面的图形栏的菜单配置，默认在空，对应参数见下表
operationMenubarConfig	Array	false	画布上面的操作栏的菜单配置，默认为空，对应参数见下表

菜单配置对象

配置的参数是一个字符串数组

对象	可选值
menubarConfig	select(框选)、drawing(自由绘画)、line(直线)、dotted(虚线)、arrow(箭头)、rect(矩形)、circle(圆形)、ellipse(椭圆形)、triangle(三角形)、text(文本)
operationMenubarConfig	back(上一步)、next(下一步)、delete(删除)、remove(删除)、save(下载)、upload(更换背景)、config(设置)