没有做浏览器兼容，仅测试了 chrome 浏览器

一、功能列表

画布等比缩放
改变线条颜色
改变线条宽度
画笔工具
画直线
画矩形
画圆
填写文本
橡皮擦
撤销上一步
清空画板
上传画板背景图片，图片仓库管理。
访问地址后跟上查询参数 ?id=roomId 可进入自定义房间免受其他用户干扰

二、效果图

三、代码讲解

服务端

-server.js                  启动 node 服务器的入口文件
-src/ws.js                  websocket路由配置相关文件

前端

-public/index.html          首页页面
-public/css/whiteBoard.css  首页样式文件
-public/image/...           首页图片资源
-public/js/Canvas.js        自己封装的Canvas类
-public/js/ImageCache.js    自己封装的本地图片缓存类
-public/js/index.js         index.html页面操作相关事件
-public/js/qbian.js         自己封装的画板上各种图形的实体类，及其自定义相关功能方法，自定义日志，配置信息等。
-public/js/UUID.js          生成UUID的js库

前端主要是一些自己封装的相关信息（qbian.js），例如圆形类、矩形类、自定义日志、自定义观察者对象、前端配置信息等。

四、启动步骤

git clone https://github.com/Qbian61/whiteBoard.git

cd whiteBoard

npm install

node server.js

启动成功后访问 http://127.0.0.1:8082 即可。

访问

我的白板

一、功能列表

二、效果图

三、代码讲解

四、启动步骤