arismileti
5 years ago
3 changed files with 408 additions and 0 deletions
@ -0,0 +1 @@ |
|||
php -S localhost:8000 |
@ -0,0 +1,223 @@ |
|||
/* |
|||
* rootApostolos |
|||
* P5js example |
|||
* IMU 2D |
|||
* |
|||
* |
|||
* |
|||
*/ |
|||
var data = {}; // Global object to hold results from the loadJSON call
|
|||
var data1 // Global object to hold results from the loadJSON call
|
|||
var bubbles = []; // Global array to hold all bubble objects
|
|||
|
|||
// accelarator data from json file
|
|||
let aX = 0; // "accelarator","X":
|
|||
let aY = 0; // "accelarator","Y":
|
|||
let aZ = 0; // "accelarator","Z":
|
|||
|
|||
var rot = 0; //
|
|||
var anglesX =0; // rotation X
|
|||
var anglesY =0; // rotation Y
|
|||
var anglesZ =0; // rotation Z
|
|||
var x1 = 500 //
|
|||
var y1 = 500 //
|
|||
var x2 = 800 //
|
|||
var y2 = 800 //
|
|||
|
|||
var G = 9.82 // g in greece https://en.wikipedia.org/wiki/Gravitational_acceleration
|
|||
|
|||
var dt = 0.1 // miliseconds -> second read in sketch Arduino
|
|||
|
|||
var AX, AY, BX, BY, CX, CY; // accelarator data after calculation
|
|||
|
|||
AX = 120; // start position X
|
|||
AY = 900; // start position Y
|
|||
|
|||
var i = 0 |
|||
|
|||
// Put any asynchronous data loading in preload to complete before "setup" is run
|
|||
function preload() { |
|||
data = loadJSON('./data/b.json'); |
|||
let file = "./data/test2.txt" |
|||
data1 = loadJSON(file); |
|||
|
|||
} |
|||
|
|||
function loadData() { |
|||
var bubbleData = data['bubbles']; |
|||
for (var i = 0; i < bubbleData.length; i++) { |
|||
// Get each object in the array
|
|||
var bubble = bubbleData[i]; |
|||
// Get a position object
|
|||
var position = bubble['position']; |
|||
// Get x,y from position
|
|||
var x = position['x']; |
|||
var y = position['y']; |
|||
|
|||
// Get diameter and label
|
|||
var diameter = bubble['diameter']; |
|||
var label = bubble['label']; |
|||
|
|||
// Put object in array
|
|||
bubbles.push(new Bubble(x, y, diameter, label)); |
|||
} |
|||
} |
|||
|
|||
// Create a new Bubble each time the mouse is clicked.
|
|||
function mousePressed() { |
|||
keyPressed() |
|||
} |
|||
function keyPressed() { |
|||
// Add diameter and label to bubble
|
|||
var diameter = random(10, 20); |
|||
var label = 'New Label'; |
|||
console.log(" i " + i) |
|||
|
|||
// load data from json
|
|||
// {"sensor":"accelarator","X":0.342388,"Y":0.153237,"Z":10.02743},
|
|||
aX = data1[i].X * G; |
|||
aY = data1[i].Y * G; |
|||
aZ = data1[i].Z * G; |
|||
sensor = data1[i].sensor; |
|||
console.log(" X " + aX); |
|||
|
|||
AX=AX+aX*dt; // new position X
|
|||
AY=AY+aY*dt; // new position Y
|
|||
|
|||
// {"sensor":"gyroscope","X":-0.000647,"Y":-0.000583,"Z":0.000652},
|
|||
var ii=i+1 |
|||
gX = data1[ii].X; |
|||
gX = gX * dt; |
|||
|
|||
gY = data1[ii].Y; |
|||
//gY = gY/8.999;
|
|||
gY = gY * dt; |
|||
|
|||
gZ = data1[ii].Z; |
|||
gZ = gZ * dt; |
|||
sensor = data1[ii].sensor; |
|||
console.log(" ii " + ii) |
|||
console.log(sensor); |
|||
console.log(gX); |
|||
console.log(gY); |
|||
console.log(gZ); |
|||
|
|||
// {"sensor":"magnometer","X":-0.000647,"Y":-0.000583,"Z":0.000652}
|
|||
var iii=i+2 |
|||
mX = data1[iii].X; |
|||
mY = data1[iii].Y; |
|||
mZ = data1[iii].Z; |
|||
console.log(" ii1 " + iii) |
|||
sensor = data1[iii].sensor; |
|||
console.log(sensor); |
|||
console.log(mX); |
|||
console.log(mY); |
|||
console.log(mZ); |
|||
|
|||
anglesZ = Math.acos((-gY)/(Math.pow(1-Math.pow(gZ,2),0.5))); |
|||
console.log("anglesZ:"+anglesZ); |
|||
|
|||
//peristrofi ston x axona mikos
|
|||
anglesX=acos(gZ); |
|||
var anglesXX = anglesX * 180 / Math.PI; |
|||
console.log("anglesXX:"+anglesXX); |
|||
console.log("anglesX:"+anglesX); |
|||
|
|||
//peristrofi ston y axona
|
|||
anglesY=acos(gX/(Math.pow(1-pow(gZ,2),0.5))); |
|||
console.log("anglesY:"+anglesY); |
|||
|
|||
BX=BX+aX*3; |
|||
BY=BY+aY*3; |
|||
|
|||
CX=CX+aX*3; |
|||
CY=CY+aY*3; |
|||
|
|||
label = " AX " + AX + " AY " + AY + " anglesX " + anglesX + " anglesY " + anglesY; |
|||
bubbles.push(new Bubble(AX, AY, diameter, label)); |
|||
console.log( " X " + AX + " Y " + AY + " D " + diameter + " L " + label); |
|||
|
|||
|
|||
// Prune Bubble Count if there are too many
|
|||
if (bubbles.length > 5) { |
|||
bubbles.shift(); // remove first item from array
|
|||
} |
|||
i=i+3 |
|||
} |
|||
|
|||
function setup() { |
|||
//createCanvas(y, x);
|
|||
createCanvas(1850, 1750); |
|||
//createCanvas(windowWidth, windowHeight);
|
|||
loadData(); |
|||
} |
|||
|
|||
function draw() { |
|||
//background(255);
|
|||
background(100, 100, 100); |
|||
|
|||
// Display all bubbles
|
|||
for (var i = 0; i < bubbles.length; i++) { |
|||
bubbles[i].display(); |
|||
bubbles[i].rollover(mouseX, mouseY); |
|||
} |
|||
|
|||
// Label directions at bottom
|
|||
textAlign(LEFT); |
|||
fill(0); |
|||
text('Click to add bubbles.', 10, height - 10); |
|||
} |
|||
|
|||
// Bubble class
|
|||
function Bubble(x, y, diameter, name) { |
|||
this.x = x; |
|||
this.y = y; |
|||
this.diameter = diameter; |
|||
this.radius = diameter / 2; |
|||
this.name = name; |
|||
|
|||
this.over = false; |
|||
|
|||
// Check if mouse is over the bubble
|
|||
this.rollover = function(px, py) { |
|||
var d = dist(px, py, this.x, this.y); |
|||
if (d < this.radius) { |
|||
this.over = true; |
|||
} else { |
|||
this.over = false; |
|||
} |
|||
}; |
|||
|
|||
// Display the Bubble
|
|||
this.display = function() { |
|||
stroke(0); |
|||
strokeWeight(0.8); |
|||
var v = createVector(0, 1); |
|||
v.setMag(300); |
|||
var xx1 = 500; |
|||
var yy1 = 800; |
|||
var xx2 = xx1 + v.x; |
|||
var yy2 = yy1 + v.y; |
|||
line(xx1, yy1, xx2, yy2); |
|||
xx1 = xx2; |
|||
yy1 = yy2; |
|||
|
|||
//https://el.wikipedia.org/wiki/%CE%91%CE%BA%CF%84%CE%AF%CE%BD%CE%B9%CE%BF_(%CE%BC%CE%BF%CE%BD%CE%AC%CE%B4%CE%B1_%CE%BC%CE%AD%CF%84%CF%81%CE%B7%CF%83%CE%B7%CF%82)
|
|||
// https://stackoverflow.com/questions/12959237/get-point-coordinates-based-on-direction-and-distance-vector
|
|||
// ihttps://en.wikipedia.org/wiki/Euler_angles#Geometrical_definition
|
|||
//angleMode(DEGREES);
|
|||
angleMode(RADIANS); |
|||
v.rotate( Math.PI - anglesX); |
|||
//v.rotate(XXX);
|
|||
stroke(255, 0, 0); |
|||
line(xx1, yy1, xx1 + v.x, yy1 + v.y); |
|||
|
|||
ellipse(this.x, this.y, this.diameter, this.diameter); |
|||
if (this.over) { |
|||
fill(0); |
|||
textAlign(CENTER); |
|||
text(this.name, this.x, this.y + this.radius + 20); |
|||
} |
|||
}; |
|||
} |
|||
|
@ -0,0 +1,184 @@ |
|||
/* |
|||
* |
|||
* rootApostolos |
|||
* P5js example |
|||
* IMU 3D |
|||
* |
|||
* |
|||
* |
|||
* |
|||
*/ |
|||
var data = {}; // Global object to hold results from the loadJSON call
|
|||
var data1 // Global object to hold results from the loadJSON call
|
|||
var bubbles = []; // Global array to hold all bubble objects
|
|||
let aX = 0; |
|||
let aY = 0; |
|||
let aZ = 0; |
|||
var rot = 0; |
|||
var anglesX =0; |
|||
var anglesY =0; |
|||
var anglesZ =0; |
|||
var x1 = 500 |
|||
var y1 = 500 |
|||
var x2 = 800 |
|||
var y2 = 800 |
|||
// g greece
|
|||
var G = 9.82 |
|||
// miliseconds se second read in sketch
|
|||
var dt = 0.1 |
|||
// motion scene to show
|
|||
var motion = 1 |
|||
|
|||
var train; |
|||
|
|||
var AX, AY, BX, BY, CX, CY; |
|||
var i = 0 |
|||
AX = 120; |
|||
AY = 900; |
|||
|
|||
|
|||
// Put any asynchronous data loading in preload to complete before "setup" is run
|
|||
function preload() { |
|||
data = loadJSON('./data/b.json'); |
|||
let file = "./data/test2.txt" |
|||
data1 = loadJSON(file); |
|||
train = loadModel('data/train-corrected.obj'); |
|||
|
|||
} |
|||
|
|||
// Convert saved Bubble data into Bubble Objects
|
|||
function loadData() { |
|||
var bubbleData = data['bubbles']; |
|||
for (var vv = 0; vv < bubbleData.length; vv++) { |
|||
// Get each object in the array
|
|||
var bubble = bubbleData[vv]; |
|||
// Get a position object
|
|||
var position = bubble['position']; |
|||
// Get x,y from position
|
|||
var x = position['x']; |
|||
var y = position['y']; |
|||
|
|||
// Get diameter and label
|
|||
var diameter = bubble['diameter']; |
|||
var label = bubble['label']; |
|||
|
|||
// Put object in array
|
|||
bubbles.push(new Bubble(x, y, diameter, label)); |
|||
} |
|||
} |
|||
|
|||
// Create a new Bubble each time the mouse is clicked.
|
|||
function mousePressed() { |
|||
keyPressed() |
|||
} |
|||
function keyPressed() { |
|||
// Add diameter and label to bubble
|
|||
var diameter = random(10, 20); |
|||
var label = 'New Label'; |
|||
|
|||
console.log(" ---> object " + i/3) |
|||
aX = data1[i].X * G; |
|||
aY = data1[i].Y * G; |
|||
aZ = data1[i].Z * G; |
|||
sensor = data1[i].sensor; |
|||
console.log(" source aX " + aX); |
|||
console.log(" source aY " + aY); |
|||
console.log(" source aZ " + aZ); |
|||
|
|||
AX=AX+aX*dt; |
|||
AY=AY+aY*dt; |
|||
console.log(" metavoli aX " + AX); |
|||
console.log(" metavoli aY " + AY); |
|||
var ii=i+1 |
|||
gX = data1[ii].X; |
|||
gX = gX * dt; |
|||
|
|||
gY = data1[ii].Y; |
|||
//gY = gY/8.999;
|
|||
gY = gY * dt; |
|||
|
|||
gZ = data1[ii].Z; |
|||
gZ = gZ * dt; |
|||
console.log(" gX " + gX); |
|||
console.log(" gY " + gY); |
|||
console.log(" gZ " + gZ); |
|||
|
|||
var iii=i+2 |
|||
mX = data1[iii].X; |
|||
mY = data1[iii].Y; |
|||
mZ = data1[iii].Z; |
|||
sensor = data1[iii].sensor; |
|||
console.log(sensor); |
|||
console.log(" mX " + mX); |
|||
console.log(" mY " + mY); |
|||
console.log(" mZ " + mZ); |
|||
|
|||
anglesZ = Math.acos((-gY)/(Math.pow(1-Math.pow(gZ,2),0.5))); |
|||
console.log("anglesZ:"+anglesZ); |
|||
|
|||
//peristrofi ston x axona mikos
|
|||
anglesX=acos(gZ); |
|||
var anglesXX = anglesX * 180 / Math.PI; |
|||
console.log("anglesXX:"+anglesXX); |
|||
console.log("anglesX:"+anglesX); |
|||
|
|||
//peristrofi ston y axona
|
|||
anglesY=acos(gX/(Math.pow(1-pow(gZ,2),0.5))); |
|||
console.log("anglesY:"+anglesY); |
|||
|
|||
BX=BX+aX*3; |
|||
BY=BY+aY*3; |
|||
|
|||
CX=CX+aX*3; |
|||
CY=CY+aY*3; |
|||
|
|||
bubbles.push(new Bubble(AX, AY, diameter, label)); |
|||
console.log( " X " + AX + " Y " + AY + " D " + diameter + " L " + label); |
|||
|
|||
// Prune Bubble Count if there are too many
|
|||
if (bubbles.length > motion) { |
|||
bubbles.shift(); // remove first item from array
|
|||
} |
|||
i=i+3 |
|||
} |
|||
|
|||
function setup() { |
|||
createCanvas(1850, 1750, WEBGL); |
|||
} |
|||
|
|||
function draw() { |
|||
//background(250);
|
|||
background(150); |
|||
//background(100, 100, 100);
|
|||
|
|||
// Display all bubbles
|
|||
for (var v = 0; v < bubbles.length; v++) { |
|||
bubbles[v].display(); |
|||
} |
|||
|
|||
} |
|||
|
|||
// Bubble class
|
|||
function Bubble(x, y, diameter, name) { |
|||
this.x = x; |
|||
this.y = y; |
|||
this.diameter = diameter; |
|||
this.radius = diameter / 2; |
|||
this.name = name; |
|||
|
|||
this.display = function() { |
|||
//angleMode(DEGREES);
|
|||
angleMode(RADIANS); |
|||
//translate(this.x,this.y);
|
|||
var camX = map(mouseX, 0 , width, -500 , 0); |
|||
camera(0,0,(height/2)/tan(PI/6),camX,0,0,1,0,1); |
|||
rotateZ(anglesZ ); |
|||
rotateX(anglesX ); |
|||
rotateY(anglesY ); |
|||
model(train); |
|||
normalMaterial(); |
|||
//noStroke();
|
|||
ambientLight(255); |
|||
}; |
|||
} |
|||
|
Loading…
Reference in new issue