# OpenTrack UDP Data Tracking

**URL:** <https://discourse.processing.org/t/opentrack-udp-data-tracking/29115>\
**Category:** Gallery\
**Created:** [April 4, 2021, 5:32pm UTC](https://discourse.processing.org/t/opentrack-udp-data-tracking/29115 "2021-04-04T17:32:11Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [April 4, 2021, 5:32pm UTC](https://discourse.processing.org/t/opentrack-udp-data-tracking/29115/1 "2021-04-04T17:32:11Z")

</div>

Hello folks,

I was inspired by this topic by @jetjaguar:  
_[Convert UDP packet to floats?](https://discourse.processing.org/t/convert-udp-packet-to-floats/27843)_  
And this gallery post:  
[Live Face Tracking (sans OpenCV)](https://discourse.processing.org/t/live-face-tracking-sans-opencv/28010)

And was working on receiving the UDP data _without_ the java.nio.ByteBuffer and java.nio.ByteOrder library at the time just [for the heck of it](https://dictionary.cambridge.org/dictionary/english/for-the-heck-of-it) and to work my brain a bit.

I do not have a face tracker so used the “Test tracker” input of the [OpenTrack](https://github.com/opentrack/opentrack/releases) software.

> **Code**
>
> ```auto
> // OpenTrack to Processing
> // v1.0.0
> // GLV 2021-02-28
> 
> //Inspiration:
> //https://discourse.processing.org/t/live-face-tracking-sans-opencv/28010
> //https://discourse.processing.org/t/convert-udp-packet-to-floats/27843
> 
> import hypermedia.net.*;
> //import java.nio.ByteBuffer;
> //import java.nio.ByteOrder;
> 
> UDP udp;
> int PORT_RX = 1717; // set port in opentrack
> String HOST_IP = "192.168.1.100";
> String receivedFromUDP = "";
> 
> double x, y, z, Y, P, R;
> 
> PImage img1, img6;
> 
> void setup() 
> {
> size(350, 270, P3D);
> udp = new UDP(this, PORT_RX, HOST_IP);
> //udp.log(true);
> udp.listen(true);
> super.start();
>   
> img1 = loadImage("side1.png");
> img6 = loadImage("side6.png");
> 
> img1.resize(180, 160);
> img6.resize(180, 160);
> 
> //ortho();
> }
> 
> void draw() 
> {
> background(0);
> textSize(20);
>   
> text((float) x, 20, 30);
> text((float) y, 20, 50);
> text((float) z, 20, 70);
> text((float) Y, 20, 90);
> text((float) P, 20, 110);
> text((float) R, 20, 130);
>   
> translate(width/2, height/2-20);
> float angleY = -radians((float) Y);
> rotateY(angleY);
> float angleP = +radians((float) P);
> rotateX(angleP);
> float angleR = -radians((float) R);
> rotateZ(angleR);
> 
> imageMode(CENTER);
> if (angleY > -TAU/4 && angleY < TAU/4)
> image(img1, 0, 0);
> else
> image(img6, 0, 0);
> }
> 
> void receive(byte[] data) 
> {    
> for(int i=7; i>=0; i--)
> {
> print(hex(data[i+24]) + " ");  
> }
> println();
> 
> x = byteArrayToDouble(data, 0);
> y = byteArrayToDouble(data, 8);
> z = byteArrayToDouble(data, 16);
> Y = byteArrayToDouble(data, 24);
> P = byteArrayToDouble(data, 32);
> R = byteArrayToDouble(data, 40);
> println(Y);
> println();
> }
> 
> Double byteArrayToDouble(byte[] data, int off) 
> {
> long longBits = 
> (data[7 + off] & 0xFFl) << 56 | (data[6 + off] & 0xFFl) << 48 | (data[5 + off] & 0xFFl) << 40 | (data[4 + off] & 0xFFl) << 32 |
> (data[3 + off] & 0xFFl) << 24 | (data[2 + off] & 0xFFl) << 16 | (data[1 + off] & 0xFFl) << 8 | (data[0 + off] & 0xFFl) << 0;
>   
> System.out.println(String.format("0x%016X", longBits));
> 
> return Double.longBitsToDouble(longBits);
> }
>   
> 
> ```

The OpenTrack software:  
_[Releases · opentrack/opentrack · GitHub](https://github.com/opentrack/opentrack/releases)_  
The images I used are in the software files.

I sized the sketch and image (top left) to match the OpenTrack output (right):

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/5/592512fed105b72807555759f7e35a79372944ea.png)

I got this working. The perspective may be a bit off.

That was fun!

`:)`