# How to display Microbit's orientation as a 3D model in Processing?

**URL:** <https://discourse.processing.org/t/how-to-display-microbits-orientation-as-a-3d-model-in-processing/40248>\
**Category:** Electronics (Arduino, etc.)\
**Created:** [December 21, 2022, 4:04pm UTC](https://discourse.processing.org/t/how-to-display-microbits-orientation-as-a-3d-model-in-processing/40248 "2022-12-21T16:04:46Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![neospace](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/neospace/32/17648_2.png) [@neospace](https://discourse.processing.org/u/neospace)\
**Post date:** [December 21, 2022, 4:04pm UTC](https://discourse.processing.org/t/how-to-display-microbits-orientation-as-a-3d-model-in-processing/40248/1 "2022-12-21T16:04:46Z")

</div>

I am working on a project with my rocketry club. I want to have a microbit control the orientation of the fins to auto-stabilize the rocket. But first, I tried to make a processing code to display in real-time my micro-bit’s orientation using its integrated gyroscope.

Here’s my processing code :

`import processing.serial.\*; // import the serial library

Serial myPort; // create a serial object

float xRot = 0; // variables to store the rotation angles  
float yRot = 0;  
float zRot = 0;  
String occ;  
void setup() {  
size(400, 400, P3D); // set the size of the window and enable 3D rendering

String portName = Serial.list()[0]; // get the name of the first serial port  
myPort = new Serial(this, portName, 115200); // open a connection to the serial port  
println((Object) Serial.list());  
}

void draw() {  
background(255); // clear the screen  
translate(width/2, height/2, 0); // center the cube on the screen  
rotateX(xRot); // apply the rotations  
rotateZ(yRot);  
rotateY(zRot);  
fill(200); // set the fill color  
box(100); // draw the cube  
}

void serialEvent(Serial myPort) {  
// this function is called whenever new data is available  
// read the incoming data from the serial port  
String data = myPort.readStringUntil(‘\n’); // read the data as a string  
// print the incoming data to the console if it is not an empty string  
if (data != null) {  
println(data);  
}  
delay(10);  
if (data != null) {  
// split the string into separate values  
String values = split(data, ‘,’);  
// convert the values to floats and store them in the rotation variables  
xRot = radians(float(values[0]));  
yRot = radians(float(values[1]));  
zRot = radians(float(values[2]));  
}  
}`  
and here’s the python code I have on my microbit

`pitch = 0  
roll = 0  
x = 0  
y = 0  
z = 0

def on\_forever():  
global pitch, roll, x, y, z  
pitch = input.rotation(Rotation.PITCH) + 90  
roll = input.rotation(Rotation.ROLL) + 90  
servos.P2.set\_angle(pitch)  
servos.P1.set\_angle(roll)  
x = input.rotation(Rotation.PITCH)  
y = input.rotation(Rotation.ROLL)  
z = 1  
serial.set\_baud\_rate(BaudRate.BAUD\_RATE115200)  
serial.write\_string(str(x) + “,” + str(y) + “,” + str(z) + “\n”)  
basic.forever(on\_forever)`  
What happens when I run my code is that a cube appears and rotates weirdly for a short time, then, the cube stops and processing prints “Error, disabling serialEvent() for COM5 null”.

Please help me out, I really need this code to be working!``

---

<div class="post-metadata">

**Author:** ![RichardDL](https://avatars.discourse-cdn.com/v4/letter/r/f475e1/32.png) [@RichardDL](https://discourse.processing.org/u/RichardDL)\
**Post date:** [December 21, 2022, 4:33pm UTC](https://discourse.processing.org/t/how-to-display-microbits-orientation-as-a-3d-model-in-processing/40248/2 "2022-12-21T16:33:35Z")

</div>

Hi @neospace, welcome to the forum. I don’t have a microbit but can see you are simply sending three numbers separated by commas, and a line-feed. All good so far. How often does the microbit run round its program and send this? With Arduino I always like to have a known rate, rather than ‘as fast as possible’. Then I can calculate whether everything can keep up. I would put a delay of 100ms initially, see if everything works. If required try faster later. (If you don’t make progress like that, try a lower baud rate.) I would start with a sketch that simply prints all the received text on the console. When that is fully reliable add in the display code.

Your post would be easier to read if you edit it and correct the format, code markers around the code sections. Some characters are showing as small squares, don’t know what’s gone wrong there.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 21, 2022, 5:47pm UTC](https://discourse.processing.org/t/how-to-display-microbits-orientation-as-a-3d-model-in-processing/40248/3 "2022-12-21T17:47:53Z")

</div>

> [@RichardDL](#):
>
> Some characters are showing as small squares

I think that’s `[]` gone

---

<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:** [December 21, 2022, 5:55pm UTC](https://discourse.processing.org/t/how-to-display-microbits-orientation-as-a-3d-model-in-processing/40248/4 "2022-12-21T17:55:36Z")

</div>

Hello,

Please format your code as per instructions here:  
[https://discourse.processing.org/faq#format-your-code](https://discourse.processing.org/faq#format-your-code)

I will certainly take a look once you have formatted it.

`:)`

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 21, 2022, 5:58pm UTC](https://discourse.processing.org/t/how-to-display-microbits-orientation-as-a-3d-model-in-processing/40248/5 "2022-12-21T17:58:52Z")

</div>

Are you sure you receive data as degrees?

Because you use `radians()`?

in my version you can rotate with the mouse

```auto

import processing.serial.*; // import the serial library

Serial myPort; // create a serial object

float xRot = 0.9; // variables to store the rotation angles
float yRot = 0.3;
float zRot = 0.2;
String occ;

void setup() {
  size(400, 400, P3D); // set the size of the window and enable 3D rendering

  String portName = Serial.list()[0]; // get the name of the first serial port
  myPort = new Serial(this, portName, 115200); // open a connection to the serial port
  println((Object[]) Serial.list());
}

void draw() {
  background(255); // clear the screen
  lights(); 

  translate(width/2, height/2, 0); // center the cube on the screen

  rotateX(xRot); // apply the rotations
  rotateZ(yRot);
  rotateY(zRot);

  fill(200); // set the fill color
  box(100); // draw the cube

  // red nose 
  translate( 60, 0, 0 );
  fill(255, 0, 0); 
  box(17); 

  yRot = map(mouseX, 0, width, 0, TWO_PI);
  xRot = map(mouseY, 0, height, 0, TWO_PI);

  //serialEventMy();
}

void serialEventMy() {
  // this function is called whenever new data is available
  // read the incoming data from the serial port
  String data = myPort.readStringUntil('\n'); // read the data as a string

  // print the incoming data to the console if it is not an empty string
  if (data != null) {
    println(data);
  }

  delay(100);
  if (data != null) {
    // split the string into separate values
    String[] values = split(data, ',');
    // convert the values to floats and store them in the rotation variables
    xRot = radians(float(values[0]));
    yRot = radians(float(values[1]));
    zRot = radians(float(values[2]));
  }
}
//

```

the rotation might not be realistic, because the way  
rotation is done in processing.

see [3D Rotations: Rotating around the screen axes - #26 by behreajj](https://discourse.processing.org/t/3d-rotations-rotating-around-the-screen-axes/14239/26)

---

<div class="post-metadata">

**Author:** ![svan](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@svan](https://discourse.processing.org/u/svan)\
**Post date:** [December 22, 2022, 12:05am UTC](https://discourse.processing.org/t/how-to-display-microbits-orientation-as-a-3d-model-in-processing/40248/6 "2022-12-22T00:05:16Z")

</div>

Is this the same problem that was posted on StackOverflow: [https://stackoverflow.com/questions/74844527/how-to-display-microbits-orientation-as-a-3d-model-in-processing](https://stackoverflow.com/questions/74844527/how-to-display-microbits-orientation-as-a-3d-model-in-processing)