多人共享、同時操作的電子白板，讓不同的參入者以不同的顏色來畫畫；可以保存當前room的內容，以讓后來者可以直接加載所有內容。
在github上找到一個用html5 canvas實現的一個電子白板的例子：
https://github.com/kblcuk/canvas-whiteboard
它是基於socket.io來實現多人白板的共享、操作。本文在它的基礎上加上了房間，這樣只有同一房間的人才會共享。
1 加入房間
客戶端：
var roomName = location.search.split('?')[1];
// Init socket.io
App.socket = io.connect('http://localhost');
App.socket.emit('create', roomName);
服務端：
io.sockets.on('connection', function(socket) {
socket.on('create', function(room) {
socket.room = room;
socket.join(room);
//get existed image as soon as join room
io.sockets.in(socket.room).emit('setup', colors[i++], imageData[socket.room]);
});
……
2 后進房間的人，要可以看到前面所有的內容
io.sockets.in(socket.room).emit('setup', colors[i++], imageData[socket.room]);
3 只在房間內廣播
服務端：
socket.emit('draw', data);
4 發送、接收
發送：
App.socket.emit('do-the-draw', data); // Broadcast draw.
注： 客戶端發送時，不需要加上broadcast.to(socket.room)
接收：
// Broadcast all draw clicks.
socket.on('do-the-draw', function(data) {
socket.broadcast.to(socket.room).emit('draw', data);
imageData[socket.room] = data.imageData;
});
一步一步搭建客服系統
.