mypainter

技术

• canvas
• WebSocket
• express
• socket.io
• Buffer
• pixel manipulation

版本

项目成长迭代

• 线上交互画板功能

• 用canvas实现画板界面

  • 提高服务器吞吐性能

• 添加取色功能

• png格式保存减少传输数据量

• 采用二进制数据存储分发图片

• 增加取色指针工具的样式

• 增加指针样式，即时显示取色指针颜色
• 变更颜色选择的样式

• 增加放大和拖动功能

  • 鼠标指针指哪儿大哪儿（地图放大原理，不动点）

• 用相对位置修正误差

  • 鼠标相对于视口的位置 - 元素相对于视口的位置）/ 缩放系数

• 增加在线人数功能

  • 向每个在线用户广播

• 增加坐标指示优化界面样式

• 移动端交互上线

线上版本

• v0.1
  • 部署到https://pxl.boolebook.com
• V0.2
  • 实现移动端交互

效果展示

PC端

移动端

使用

1. 安装依赖

   npm install

2. 服务器运行

   pm2 start --name=xxx app.js

3. 访问mypainter

个人信息

bairuobing2013

boolebook