SOFTWARE & LIBRARIES
- Processing (I have installed on my mac the old 1.5.1 version, bu there are newer)
- with the Processing Serial Library (should be already installed with the program)
- Model Builder Library by Marius Watz
In particular I started from the mb_04_gui_heightfield example
- ControlP5 Library by Andreas Schlegel
In particular the ControlP5slider and ControlP5behaviour examples


BOARD
I used the node0 bridge board I built during week 13, which is a step response board, and represented in the app the data coming from the sensor readings.
In preparation for my final project, which will involve creating a sensing & actuating textile whose changes will be simulated in real time in a custom made app, I wanted to start representing a flat surface with 3 dimensional features.

GETTING SENSOR READINGS
The first step was to get the data coming from the serial port to be read by the Processing sketch.
I basically transferred the code contained in the python hello.load example provided by Neil and adjusted it for my purposes. In the sample code Neil sends the 1 2 3 4 framing, then gets 3 readings from the C code, and represents 3 sets of values in the python interface.
In my code I am simplifyiong the readings: only sending the 1 2 3 4 framing, and 1 set of values: up_low1, up_high1, down_low1, down_high1.

And in void setup I am connecting to my serial port with the command: myPort = new Serial(this,"/dev/tty.usbserial-AHOORXGK", 9600);
which is preparing the ground for serial communication.

In draw I start reading from the serial port through the command myPort.read(); which passes the values from the board to Processing.
The values should look something like:
1
2
3
4
up_low1,
up_high1,
down_low1,
down_high1.

I am basically assigning the values backwards, and wait to receive the framing before receiving the relevant 4 readings. The first incoming value is assigned to down_high1, but in the following loops is passed onto down_low1, etc... till it gets to 1. If when the values passed to the 1 2 3 4 actually correspond to the 1 2 3 4 framing, then I progress in assigning the next incoming values to: up_low1,
up_high1,
down_low1,
down_high1.
These readings are then transformed into workable value through a formula, till I obtain value1.
Since value1 mainly fluctuates between 400 and 800, I mapped this value to 0 to 200, and used the resulting values to the width of an ellipse.



INTERFACE 01
I then started working on the mb_04_gui_heightfield example.
I initially understood that:
- a solid is generated in the program
- the resolution of the grid can be increased or decreased with a slider
- a png file in black and white is imported and used to generate new Z values
according to the variations between black and white in the image, resulting in a 3d shape
- the Z values can be accentuated through a slider.

I had a close look at the 5 subsketches and eliminated the irrelevant parts to shape my sketch. I also turned the solid into a flat surface.
MAIN SKETCH
GUI
Pt
TERRAIN
GENERATE

MAIN SKETCH:
- png image is loaded
- mouse movements are initialised to generate transformations in the 3d model
- the mesh is generated - Terrain is drawn (between pushMatrix() and popMatrix() )

GUI SKETCH :
it is based on the ControlP5 library.
- here sliders and toggles are defined
- the mouse events are 'prepared' to be listened to

The ControlP5 library eases the generation of toggles and sliders. It listens to the mouse events (in the relevant area of the patch) and acts in accordance.
Sliders objects are created through:
- controlP5.addSlider() function
- variable
Variable name and slider name must match.
Z =15; //starting value of slider when sketch is open
controlP5.addSlider(
"Z", //string "" is the name that will appear
5, //min value
40, //max value
Z,
20, // X position of slider
20, // Y position of slider
100, // width of slider
13);// height of slider

PT SKETCH:
creates a class Pt of points, that are then used in the other sketches

TERRAIN SKETCH:
Here the class 'Terrain'is generated.
This class creates:
- a set of points ( that refreses based on the grid resolution slider values)
- the Ugeometry model (a feature of the model builder library that initialises a solid)
- void buildModel() function, that draws a mesh surface from the set of points, in a QUAD_STRIP configuration - the array of points generateImagePoints() (defined in generate sketch) is created within the buildModel() function

To understand how the shapes are drawn I looked for the
beginShape() function
endShape() function
which take a number of vertexes and draw lines between them in different ways (QUAD_STRIP in our case).

GENERATE SKETCH:
In here the array of Pts generateImagePoints() is generated.
- It is an array of pt vectors.
- The size of the canvas (resulting from the points array) is relative to the width and height of the screen.
- The nr of points is relative to the gridRes values (int res) coming from the slider.
- The Z value coming from the Z slider is used to generate the varying Z of each vector based on the png image



INTERFACE 02
The Interface 01 controls the Z height by listening the mouse event on the slider, whereas I want the Z value to come directly from the sensor. How to do it?

To implement this feature I had to:
- understand how to automatize the Z slider with the sensor readings
- integrate the implementation in the interface 01

I started from the ControlP5behaviour example and imported the sensor reading features implemented for the ellipse example.

IMPLEMENTATION:
The .addSlider("slider",...) function is called in setup, which means that the incoming Z values cannot be refreshed in setup as it would be in draw.
- I added in the setup the serial port listening command to listen to the incoming values
- I created a generateZ(float value) function which generates my mapped Z value, that I called newZ and runs in void draw
- I used the custom ControlBehaviour TimeEvent class to refresh my values. It updates through the public void update(), which involves using millis instead of looping
-I used the :

controlP5.controller("slider").setBehaviour( new ControlBehaviour() {
float a = 0;
public void update() { setValue(newZ);
}
}

to update the incoming Z values in the slider in setup



Now that I have my automatically generating Z based on the sensor readings I moved all these features in the Interface 01 sketch.

IMPLEMENTATION:
- imported the generateZ() function
- ran generateZ(newZ) in draw
- in the generate sketch substituted Z with newZ



And
- added another terrain object for future developments
- added scaling slider feature to fit more objects





FILES DOWNLOAD LINK