LIDAR with Threejs

finally got to use threejs with a hardware project :smiley:

the rig

my proudest and creepiest selfie

laser floor plan


I can share the code if anyone wants. I used a python websocket for threejs and a serial connection to the hardware through a usb


How complicated and expensive is it to setup this rig? I worked in two AV companies but all i got were blobs of bytes that i had to draw with webgl, not even always with three.

This is just hardware reporting points in 3d space via a web server, there is no ROS or something like that involved? I am so embarrassed to not know anything about this. What would ROS replace in your pipeline if anything?


By just, i mean, a lot of code running and figuring out where these servos are at and voltages and phases and cycles and all that, which feels like rocket science to begin with :slight_smile:


Love that hardware rig! The giant neo magnet for weight/stability is a nice touch. :smiley:
Looks like you’re getting good resolution!

1 Like

about ~200$ USD. The lidar module was 130$, chips and motors were about $45. My most expensive personal project… If you have a 3D printer you could save some cost!

Arduino code keeps track of the angles and distance, sends data to a python websocket/flask_function which sends the data to the JS. I would like to explore other methods though! And arduino libraries made kepping track of the motors position(s) pretty easy.

I would attach the code but im afraid ive changed too much since i posted. Here are the libraries and core functions used


#include <Adafruit_MotorShield.h>
Adafruit_MotorShield AFMS = Adafruit_MotorShield();
Adafruit_StepperMotor *myMotor = AFMS.getStepper(200, 2);
#include <Servo.h>
Servo myservo;
#include <Wire.h>
#include <LIDARLite.h>
LIDARLite myLidarLite;

// ..
// more code im not showing...
// ..

for (int tilt = 90; tilt >= 0; tilt -= 1) { // goes from 0 degrees to 90 degrees
  for(int pan = 0;pan<600;pan+=1)
    myMotor->step(1, FORWARD, SINGLE); // 600 steps for full turn 20/60 teeth setup, 200 * 60/20 ; INTERLEAVE --> 1200, 400 full full turn


from flask import Flask, render_template, request, jsonify
import json
from flask_sock import Sock
import serial
arduino_port = "/dev/cu.usbmodem101"  # serial port of Arduino
baud = 9600
ser = serial.Serial(arduino_port, baud)

# ..
# more code im not showing...
# ..

def echo(sock):
    while True:
        lidarData = ser.readline()
        lidarDataSplit = lidarData.decode('utf-8')[0:-1].split('-')
        distance = int(lidarDataSplit[2])
        di.update(float(lidarDataSplit[0]), -float(lidarDataSplit[1]), distance)
        data = {
            'rgb': f2rgb.to_rgba(distance)[:3],
            'size': (distance-5)/495 + 1
        print(f"running...: {counter.idx * cInv:.2f}%, distance: {distance}")
1 Like

Thanks! Glad you noticed the counter weight, it’s actually a big piece of tungsten. Didn’t think i would ever use it practically lol. 600 steps in the pan direction and 90 steps in the tilt direction

1 Like


made a github with the python threejs code


Get that thing strapped to a stepped scalextric track :wink::grin:

1 Like



This is so freakin cool.

I remember about 10 years ago, I tried to build a scanner with a webcam a laser, some servos, and a glass prism to spread the beam out, then infer the depth from binocular camera capture.
All I ever got out of it was a fuzzy mess… It’s super satisfying to see the real deal. It’s exactly how I imagined it. :smiley:

Also additive blended point clouds are just so… wicked looking.