Doodle with strangers on InterWeb!

This is a very simple multi-user doodling web app, using PubNub real-time network JavaScript API, that enable you to draw on the canvas with strangers.
Authors: Tomomi Imura

PubNub Publish and Subscribe
Collaborative HTML5 Canvas Made Easy

With PubNub's data streaming, you can display all users' drawing paths by simply sending and receiving canvas coordinates to PubNub data stream.

Publish and Subscribe Draw Paths

Build your drawing web app by simply:

  • Creating a drawing canvas that allows a user to draw, with HTML5 Canvas
  • Publishing the drawing path data to PubNub data stream
  • Subscribing the data from other users from the data stream, and draw on the canvas

To send data, all you have to do is broadcast the array of canvas coordinates to a channel with publish(). To retrieve the published data, you simply need subscribe().

Displaying Occupancy

You can also display the number of users online with Presence Detection API. presence() receives user events including Join/Leave status changes.

Fetching Old Data Using History

You can easily retrieve last drawing data using history() API. This function fetches historical messages of a channel. This Storage & Playback feature provides realtime access to a history for all messages published to PubNub.

Try PubNub Today

Try Our APIs