Node.js library for easily creating an ePaper display on a Raspberry Pi using HTML and Javascript.
- Render HTML DOM onto ePaper display
- Simple and extensible Javascript and WebSocket API
- Supports multiple Waveshare ePaper Displays
- High performance, native c++ hardware access
Create static/index.html
. The contents of this webpage will be rendered onto the ePaper display.
<!DOCTYPE html>
<html lang="en">
...
<body>
<h1>Hello from ePaper.js</h1>
<script>
// connect to the WebSocket API
const ws = new WebSocket('ws://localhost:8080');
ws.addEventListener('open', () => {
// draw contents of DOM onto ePaper display
ws.send('render');
});
</script>
</body>
</html>
From Node.js initialize ePaper.js. This does the following:
- Creates a webserver that serves
index.html
from thestatic
directory, or serves a page from an external web server - Loads index.html in a headless instance of Chromium, using Puppeteer
- Creates a WebSocket API that the frontend can use to trigger a display refresh, or perform custom actions
- Renders the contents of the browser DOM onto the ePaper display
const { init } = require('epaperjs');
init();
Additional Configuration Options
const { devices, init } = require('epaperjs');
init(devices.waveshare4in2, {
webPort: 3000, // WebServer Port
websocketPort: 8080, // WebSocket API Port
staticDirectory: 'static', // Directory to serve frontend from
skipWebServer: false, // If set to true will not create a local web server
url: `http://localhost:3000/index.html`, // Initial URL to load
});
Extend the server side WebSocket API
const { devices, init } = require('epaperjs');
const render = (page, ws) => {
// Forward frontend console output to Node.js console
page.onConsoleLog(console.log);
// When recieving 'render' from frontend, update display
ws.on('message', async (message) => {
if (message === 'render') {
await page.display();
}
});
// forward keypresses to the frontend over WebSocket
process.stdin.addListener('keypress', (key, data) => {
if (data.name === 'left') {
ws.send('left');
}
if (data.name === 'right') {
ws.send('right');
}
});
};
init(devices.waveshare4in2, {}, render);
Examples
See the examples directory
- weather-station: This creates and example weather station display
- ereader: An ereader that reads epub files and uses the left and right keypresses to change pages
Raspberry PI
Enable SPI
sudo raspi-config
# Choose Interfacing Options -> SPI -> Yes to enable SPI interface
sudo reboot
Install Dependencies
# Install latest Node.js LTS
curl -sL install-node.now.sh/lts | sudo bash
sudo apt-get update
# Install wiringpi
sudo apt-get install -y wiringpi
# For Pi 4, you need to update wiringpi (skip otherwise):
cd /tmp
wget https://project-downloads.drogon.net/wiringpi-latest.deb
sudo dpkg -i wiringpi-latest.deb
#You will get 2.52 information if you've installed it correctly
gpio -v
# Remaining dependencies
sudo apt-get install -y build-essential chromium-browser
Node.js
Install ePaper.js
npm install -S epaperjs
Device | Supprted Display Modes |
---|---|
Waveshare 4.2" | Black / White, 4 Gray |
Waveshare 7.5" v2 | Black / White |
Waveshare 3.7" hat | Black / White, 4 Gray |
Waveshare 2.13" hat v2 | Black / White |
Waveshare 2.13" bc | Black / White |
It's easy to extend ePaper.js to support additional Waveshare devices. Displays from other manufacturers should be possible to support as well, as long as there is a C / C++ driver available.
If you would like to request support for another display, please open an issue with the title 'Add support for <Device Make \ Model>'. If you're a developer and have extended support yourself, put up a pull request!
- Add support for portrait or landscape display (rotate 90 deg)
- Add support for remaining Waveshare SPI ePaper displays
- Implement 4 Color Grayscale
- Implement Red / White / Black Color Mode
- Implement Yellow / White / Black Color Mode
- Implement Partial Refresh