canvas-designer-widget.js是一款js白板手写板画板插件-BFW插件库

canvas-designer-widget.js是一款js白板手写板画板插件

canvas-designer-widget.js是一款js白板手写板画板插件，支持铅笔、文字、图形、pdf文件、箭头、曲线，功能很强大，支持导出、多人共享画板功能。

使用方式：

第一步引入bfwone

第二步use插件

第三步配置参数

示例代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        bready(function() {
            use(["canvas-designer-widget"], function() {

                var designer = new CanvasDesigner();




                // both links are mandatory
                // widget.html will internally use widget.js
                designer.widgetHtmlURL = '//repo.bfw.wiki/bfwrepo/html/widget.html'; // you can place this file anywhere
                designer.widgetJsURL = '//repo.bfw.wiki/bfwrepo/js/widget.js'; // you can place this file anywhere

                designer.setSelected('pencil');

                designer.setTools({
                    pencil: true,
                    text: true,
                    image: true,
                    pdf: true,
                    eraser: true,
                    line: true,
                    arrow: true,
                    dragSingle: true,
                    dragMultiple: true,
                    arc: true,
                    rectangle: true,
                    quadratic: true,
                    bezier: true,
                    marker: true,
                    zoom: true,
                    lineWidth: true,
                    colorsPicker: true,
                    extraOptions: true,
                    code: true,
                    undo: true
                });

                designer.appendTo(document.getElementById("board"));


            });
        });
    </script>
    <style>
        * {
            padding: 0;
            margin: 0;
        }
    </style>
</head>
<body>
    <div id="board" style="width:100vw;height:100vh;"></div>
</body>
</html>

官网代码:https://github.com/muaz-khan/Canvas-Designer