Skip to content

Instantly share code, notes, and snippets.

@Mathews2115
Last active April 25, 2024 00:47
Show Gist options
  • Star 19 You must be signed in to star a gist
  • Fork 5 You must be signed in to fork a gist
  • Save Mathews2115/ed3dbd8623ee815a7bed363dbc7c73a6 to your computer and use it in GitHub Desktop.
Save Mathews2115/ed3dbd8623ee815a7bed363dbc7c73a6 to your computer and use it in GitHub Desktop.
Automotive dashboard / Gauge cluster on a Raspberry Pi 3 using chomium and node.js

Quick How-To Raspberry Pi 3 Dashboard setup.

This is outdated - refer to this for more updated instructions

WHAT THIS DOESN'T HAVE

  • Code that listens and parses CAN messages. (Though I do use this and it is amazing)

Quick Hardware Review

  • Gauge Cluter/Dashboard
  • A raspberry pi will listen for CANBUS messages and whatever program you use (or make) will reactive to those messages.
  • I used Two apps:
    • backend Node.js app that listens to CAN messages (and sends info to a front end via websockets)
    • front Chromium web app that displays your information. (you can use whatever you want though)
  • Powered by car's 12v (using DC-DC converter)
  • Everything auto-starts on power up
  • Everything saves and closes on power down

My Parts List (yours may vary)

Initial Pi setup

Folow what I have below but also feel free to give this a quick look too: heavily inspired by this

Get the OS image installed

  1. Download and RASPBIAN STRETCH LITE onto your micro SD card.

Initial Configuration

(configure the pi) in the console:

  1. sudo raspi-config
  2. Go to Change User Password and CHANGE LOGIN PASSWORD
  3. Go to Network Options: setup wifi if needed; you want to update your firmware, drivers, software, etc.
  4. Go to Boot Options --> B1: Desktop / CLI: console - Auto login (So when it powers up, it automatically logs in. You can turn this off later after development if needed)
  5. Go to Boot Options --> B2: Wait for Network Boot: NO (dont wait for it - it will boot faster but may take a bit before you can actively do a apt-get or ssh action )
  6. Go to Interface Options --> SSH: YES (makes it so you can log into your Pi through your wifi)
  7. Go to Advance Options --> memory split: 256
  8. (anything else you want, you can always come back)
  9. FINISH

Make sure to update everything before proceeding

  1. sudo apt-get -y update && sudo apt-get -y upgrade ; sudo apt-get autoremove
  2. sudo reboot

Install Video Driver

This will be needed to get Chromium hardware accelerated.

  1. Install drivers: sudo apt-get install libgl1-mesa-dri
  2. Then enable the the driver: sudo raspi-config
  3. Advance Options --> A7: GL Driver --> G2 (FAKE KMS)
  4. This will allow chromium to hardware accelerate stuff...(but more on that later)
  5. Reboot: sudo reboot

Setup for required GUI stuff

Chromium and the thing that will "host" chromium

  • sudo apt-get install --no-install-recommends xserver-xorg x11-xserver-utils xinit openbox
  • sudo apt-get install --no-install-recommends chromium-browser

Configure xserver / Chromium

openbox is now installed; let's make it so our window's manager starts up chromium (auto start stuff comes later)

  • sudo nano /etc/xdg/openbox/autostart
# Disable any form of screen saver / screen blanking / power management
xset s off
xset s noblank
xset -dpms

# Allow quitting the X server with CTRL-ATL-Backspace
setxkbmap -option terminate:ctrl_alt_bksp

# Start Chromium in kiosk mode
sed -i 's/"exited_cleanly":false/"exited_cleanly":true/' ~/.config/chromium/'Local State'
sed -i 's/"exited_cleanly":false/"exited_cleanly":true/; s/"exit_type":"[^"]\+"/"exit_type":"Normal"/' ~/.config/chromium/Default/Preferences
chromium-browser --kiosk --disable-overscroll-edge-effect --disable-sync --disable-suggestions-ui --disable-signin-promo  --mmal-frame-copy --mmal-frame-buffers=4 --ignore-gpu-blacklist --enable-native-gpu-memory-buffers --start-maximized --disable-infobars 'http://your-url-here'
  • Above - we eliminate basically ALL of the tool bars, notifications etc.
  • We also enable a bunch of crap so we can get "accelerated" canvas, etc
  • Later - when we get our web server running, http://your-url-here will be replaced with our actual url.
  • To start chromium now: type startx -- -nocursor
  • To quit chromium/x server - hit Ctrl-Alt-Backspace

Auto Start Chromium

  1. sudo nano /home/pi/.bash_profile
[[ -z $DISPLAY && $XDG_VTNR -eq 1 ]] && startx -- -nocursor

PLAYING WITH CAN

Installing needed drivers

  1. sudo apt-get -y install can-utils libsocketcan2 libsocketcan-dev

Setting up PiCAN2

PiCAN2 Device Overlays (enable CAN device)

  1. Enable SPI either through raspi-config or add dtparam=spi=on to /boot/config.txt
  2. put the following in: /boot/config.txt
#CAN bus controllers
dtoverlay=mcp2515-can0,oscillator=16000000,interrupt=25
dtoverlay=spi-bcm2835-overlay

auto-start CAN interface on bootup

  1. sudo nano /etc/network/interfaces
  2. Paste this into there
auto can0
iface can0 inet manual
   pre-up /sbin/ip link set can0 type can bitrate 500000 triple-sampling on
   up /sbin/ifconfig can0 up
   down /sbin/ifconfig can0 down

helpful links:

Powerblock

5v power from your DC-DC will go directly to this! You're ignition 5v switch/signal with go to the Powerblock's signal jumper.

  1. Install their driver. That's it.

Install NodeJs

  1. curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
  2. sudo apt-get install -y nodejs

Forcing monitor resolutions (if the EDID supports it of course)

On the latest setup, I have two 10 inch screens but I still force the resolution at 800x480 for the first rasp pi and 1080x720 for the second r-pi.

  1. sudo nano /boot/config.txt
  2. make sure these exist and are uncommented For main dash:
framebuffer_width=800
framebuffer_width-480

For second rpi/screen:

framebuffer_width=1080
framebuffer_width-720

MAKE A BACKUP

Now that we have installed most of the required OS stuff....LET'S MAKE A BACKUP! Whenever you make successful changes to your OS, always backup your SD image just in case you corrupt your SD card's file system. (like if you shutdown incorrectly, or install something crappy, or screwup a boot config...etc etc etc)

  • READ THIS PAGE
  • From your mac: sudo dd bs=4m if=/dev/rdisk2 of=someCoolBackupName.img
@nooklyn1
Copy link

how are you planning to set up the web server?

@Mathews2115
Copy link
Author

@nooklyn1 Hey! I've been bad about updating this but I've completed this project.

See these two repositories for further info:

@fromage9747
Copy link

@Mathews2115 What is the boot time from the turn of the ignition to displaying the gauges? Really interested in this as it's using the technologies I use daily. I have looked online and found some raspberry boot times of just under two seconds. If that can be accomplished, its still a case of getting the webserver running and displaying the UI, though the UI can be lazy loaded.

@Mathews2115
Copy link
Author

@fromage9747 - Hey! I've updated this a bit; it can be found in the readme for my new dash project.

Definitely not 2 seconds for me. I'd say closer to 40-50 seconds with all the junk I'm doing. I'll have a more definite answer in a week as I'm about to road test this new project with a Pi 4.

I believe once I disable networking/bluetooth (or at least defer it to start manually post boot), it should shave hopefully up to 10 seconds off that off.

@Mathews2115
Copy link
Author

and to clarify: my definition of boot time is power-on to UI showing completely.

@fromage9747
Copy link

@Mathews2115 Yeah, I took a look at the other repositories, just couldn't find anywhere except here to send you a message. Well, 40 to 50 seconds is not bad and if you can get it down to 10 then that's fantastic. especially with this being done on NodeJS and Angular!

@Mathews2115
Copy link
Author

Mathews2115 commented Oct 18, 2021 via email

@fromage9747
Copy link

@Mathews2115 By any chance do you have a video of the bootup? Or at least when you road test it, I would be super keen to check out a clip of it!

@Mathews2115
Copy link
Author

Mathews2115 commented Oct 18, 2021 via email

@marcusawereally
Copy link

Hey, I know this is old, but I am curious if this is still good? I am planning on doing this. I am curious if I can edit the webpage to make it fit inside my cluster area? I am guessing it is just html, javascript and css so I could just make it fit the screen size with CSS? I'm excited. My gauge cluster went out and it is 300 bucks for a new one and I can get an LCD for 100 bucks and I already have a pi and the canbus.

@Mathews2115
Copy link
Author

Mathews2115 commented Mar 20, 2023

This is a bit old, I'd try out the pi setup from my newer project
- comes with a simple web page demo (here) @marcusawereally

@marcusawereally
Copy link

Thank you @Mathews2115 I am looking into it now. i am measuring my old cluster to find the right size LCD/LED to fit and will begin working on testing out your new project with my equipment. Thanks for the heads up!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment