https://github.com/tomhumphries/infinitecanvaswhiteboard

An infinite whiteboard built using a canvas element
https://github.com/tomhumphries/infinitecanvaswhiteboard

canvas infinite scaling touchscreen whiteboard

Last synced: 22 days ago
JSON representation

An infinite whiteboard built using a canvas element

• Host: GitHub
• URL: https://github.com/tomhumphries/infinitecanvaswhiteboard
• Owner: TomHumphries
• Created: 2020-07-05T11:17:40.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2020-07-06T09:59:52.000Z (over 4 years ago)
• Last Synced: 2024-11-08T11:50:08.815Z (3 months ago)
• Topics: canvas, infinite, scaling, touchscreen, whiteboard
• Language: HTML
• Homepage:
• Size: 441 KB
• Stars: 145
• Watchers: 6
• Forks: 31
• Open Issues: 0
• Metadata Files:
  • Readme: readme.md

Awesome Lists containing this project

README

        
# Infinite whiteboard template

## About

This is a template for an infinite whiteboard that uses a `````` element.

An example site that has built on this code (adding collaboration and other features) can be found at [infiniboards.com](https://infiniboards.com).

## Accessing the whiteboard

You can open ```index.html``` to use the whiteboard in desktop mode, or run the ```Node.js``` server with:

```

node app.js

```

to access it at ```http://localhost:3000```. Depending on your firewall settings you should be able to connect to the server from a mobile device on your network by entering your computer's IP address in your mobile's browser like so: ```192.168.__.__:3000```.

## Desktop controls

- Left click to draw

- Right click to pan

- Scroll to zoom

## Mobile controls

- Single touch to draw

- Double touch to zoom / pan

## Example mobile use

![Example](./example.gif)

*gif created with [ezgif](https://ezgif.com/)*